【Html】DW图片轮播(如何套用别人的js)

思路是这样的
把别人的例子移值到自己的网页里。把别人的JS、css做成文件,再用DW调用。再修改路径、css等就可以了。

列子:下面就是图片轮播的css。在DW新建一个css页面类型,粘贴保存为ADV.css文件,放在命名为css的文件夹内。(PS:如果要修改别人的css样式就需要打开ADV.css进行修改)
@charset "utf-8";
/* banner */
.banner{                            这个就是控制广告外观大小的css样式
 width: 1014px;                 这里改广告的宽
 height: 317px;                  这里改广告的高
 position: relative;
 overflow: hidden;
 margin: 0%;
}

.banner-btn{display:none;}
.banner-btn a{display:block;line-height:40px;position:absolute;top:120px;width:40px;height:40px;background-color:#000;opacity:0.3;filter:alpha(opacity=30) color:rgb(255, 255, 255);overflow:hidden;z-index:4;}
.prevBtn{left:5px;}
.nextBtn{right:5px;}
.banner-img{font-size:0;*word-spacing:-1px;/* IE6、7 */ letter-spacing:-3px;position:relative;}
.banner-img li{display:inline-block;*display:inline;*zoom:1;/* IE6、7 */ vertical-align:top;letter-spacing:normal;word-spacing:normal;font-size:12px;}
.banner i{background:url(http://gtms01.alicdn.com/tps/i1/T1szNBFzlmXXX8QSDI-400-340.png)  no-repeat;width:15px;height:23px;cursor:pointer;margin:8px 0 0 12px;display:block;}
.banner .nextBtn i{background-position:-200px -24px;}
.banner .prevBtn i{background-position:-200px 0px;}
.banner-circle{position:absolute;left:50%;bottom:15px;height:13px;text-align:center;font-size:0;border-radius:10px;background:rgba(255,255,255,0.3);filter:alpha(opacity:30);}
.banner-circle li{border-radius:10px;margin:2px;display:inline-block;display:-moz-inline-stack;vertical-align:middle;zoom:1;}
.banner-circle li a{display:block;padding-top:9px;width:9px;height:0;border-radius:50%;background:#B7B7B7;overflow:hidden;}
.banner-circle .selected a{background:#F40;}

把别人的文件js/jquery.min.js放在命名为js的文件夹内。

别人在例子中写的js,复制下来,粘贴到文本,把.txt改成.js

【开始调用】

<link href="css/ADV.css" rel="stylesheet" rev="stylesheet" />        这个是调用css的写法蓝色为路径
          这个是调用js的写法  (蓝色为路径
                     


在需要插入广告的位置粘贴
 

   


你可能感兴趣的:(Html笔记)