D000-CSDN博客

原创 JavaScript 回到顶部效果

<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>JavaScript 回到顶部效果</title> <style> .box{ width: 1000px; margin: 0 auto; } .btn{ posi

2016-12-27 14:20:56 340

原创渐隐渐显轮播/fadeIn()/fadeOut()/左右点击轮播

<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <link href="https://cdn.bootcss.com/font-awesome/4.6.3/css/font-awesome.css" rel="stylesheet"> <st

2016-09-18 10:51:42 1660

原创 JS缓冲运动

JS缓冲动画，定时器，向上取整，向下取整

2016-08-17 10:50:28 256

原创 JQ div随机显示背景色/取整函数/

上代码栗子<!DOCTYPE html ><html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><script src="https://cdn.bootcss.com/jquery/3.0.0/jquery.min.js"></script><title>无标题文档</title>

2016-08-05 14:23:03 2077 1

原创弹出框上下居中

<div class="fixed-pop"><div class="text">证明您作为涉嫌侵权内容所有者的权属证明</div></div> .fixed-pop{ position: fixed; left: 50%; top: 50%; display: table;

2016-07-19 17:15:25 322

原创文字太长显示省略号（...）

text-overflow属性 text-overflow:clip | ellipsisclip:只是简单的裁切，不显示(…); ellipsis:裁切，要实现显示（…）还需要两个属性的配合 1.强制文本在一行显示（white-space:nowrap） 2.溢出内容隐藏（overflow:hidden） 3.需要定义容器的宽度text-overflow属性在ie系列得到较好的支持，在O

2016-07-19 17:12:56 1355

原创 html判断音视频是否播放完毕后弹出提示

使用ended事件//音频<audio id="audio" controls="true" autoplay="true"> <source src="/i/song.ogg" type="audio/ogg"> <source src="/i/song.mp3" type="audio/mpeg"> Your browser does not support the audio e

2016-07-01 11:03:19 22054

原创 jQuery图片翻牌品牌翻转切换效果

var verticalOpts = [{'width':0},{'width':'180px'}]; //垂直翻转只需改变widthvar horizontalOpts = [{'height':0,'top':'120px'},{'height':'240px','top':0}]; //水平翻转需改变height和top

2016-06-30 16:30:35 1542

原创仿阿里云购买时长选择

代码<!DOCTYPE html"><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>仿阿里云购买时长选择</title><style>body{font-family: 'Microsoft Yahei'}ul,li{ padding:0; margin:0;

2016-06-27 16:32:34 563

原创 JavaScript--V字

var div = document.getElementsByTagName('div'); for(var i=0; i<11; i++){ document.body.innerHTML += '<div>'+i+'</div>'; } var len = div.length; for(var i=0;

2016-03-10 16:13:46 336

原创纯原生JS轮播图片

代码：<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>图片切换</title><style> *{padding: 0;margin: 0; text-decoration: none; list-style: none; fon

2016-02-25 14:25:09 725

原创 JQ中的事件与动画

//停止事件冒泡event.stopPropagation();//阻止默认行为event.preventDefault();//停止事件冒泡&阻止默认行为return false;//事件对象的属性 //1.event.type 获取到事件的类型 $('a').click(function(event){ a

2016-02-25 14:19:01 320

通过Photoshop屏幕截图可以注意到，颜色从0%的不透明度开始，第一个色标的位置位于0%，其透明度为0%，第二个色标位置为80%的不透明度，位置位于8%。可以使用这个渐变工具从CSS声明中捕捉相关数据，实现自定义线性渐变。一个渐变可以包含多个色标，位置值为0～1之间的小数，或者0%～100%之间的百分数，指定色标的位置比例，其用法与Photoshop中的值线渐变工具用法相似..toLeft {

2015-12-03 13:57:47 286

原创解决jQuery和其他库的冲突

1、jQuery在其他库之后导入可以调用jQuery.noConflict()函数来将变量$的控制权交给其他JavaScript库 jQuery.noConflict();//将变量$的控制权交给其他JavaScript库 jQuery(function(){ jQuery('p').click(function(){

2015-12-02 09:57:43 273

原创 DOM对象和jQuery对象

DOM对象可以使用JavaScript中的方法var domObj = document.getElementById('id');//获得DOM对象var domObjHtml = domObj.innerHTML;//使用JavaScript中的属性——innerHTMLjQuery对象是通过jQuery包装DOM对象后产生的对象$('#id').html(); //等同于 document

2015-12-02 09:51:55 302

原创日历

<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>备忘录</title> </head> <style> *{ margin: 0; padding: 0; font-family: '微

2015-10-30 18:19:23 289

原创 JavaScript选项卡

html代码<div class="tabs"> <ul id="tab-nav" class="tab-ul"> <li class="active">HTML</li> <li>CSS</li> <li>JAVASCRIPT</li> </ul>

2015-10-30 18:05:57 255

转载欢迎使用CSDN-markdown编辑器

快捷键加粗 Ctrl + B 斜体 Ctrl + I 引用 Ctrl + Q插入链接 Ctrl + L插入代码 Ctrl + K插入图片 Ctrl + G提升标题 Ctrl + H有序列表 Ctrl + O无序列表 Ctrl + U横线 Ctrl + R撤销 Ctrl + Z重做 Ctrl + Y

2015-10-30 18:00:44 183

DiDaDi的博客