欢迎进入广州凡科互联网科技有限公司网站
全国服务热线
4000-399-000
织梦cmsdedecms照片无缝拼接横着翻转
时间: 2021-02-23 02:41 浏览次数:
用织梦cms建网站时,有时候将会必须进行一排照片横着无缝拼接翻转的实际效果,常常采用这类款式的有商品展现,实际上作出无缝拼接的照片横着翻转非常简单。好织梦cms梳理一下从
用织梦cms建网站时,有时候将会必须进行一排照片横着无缝拼接翻转的实际效果,常常采用这类款式的有商品展现,实际上作出无缝拼接的照片横着翻转非常简单。好织梦cms梳理一下从在网上查出的一个js编码的应用方式以下: 1、把下边款式放进css文档中,用于调节照片尺寸款式。 styletype=tex...

     用织梦cms建网站时,有时候将会必须进行一排照片横着无缝拼接翻转的实际效果,常常采用这类款式的有商品展现,实际上作出无缝拼接的照片横着翻转非常简单。好织梦cms梳理一下从在网上查出的一个js编码的应用方式以下:
1、把下边款式放进css文档中,用于调节照片尺寸款式。
style type= text/css
!--
#demo {
background: #FFF;
overflow:hidden;
border: 1px dashed #CCC;
width: 500px;
}
#demo img {
border: 3px solid #F2F2F2;
}
#indemo {
float: left;
width: 800%;
}
#demo1 {
float: left;
}
#demo2 {
float: left;
}
--
/style
2、把下边编码放进必须翻转的照片目录的部位,在其中鲜红色编码的一部分能够更换成织梦cms的照片目录编码。
div id= demo
div id= indemo
div id= demo1
a href= # img src= /jscss/demoimg/wall_s1.jpg  border= 0  / /a
a href= # img src= /jscss/demoimg/wall_s2.jpg  border= 0  / /a
a href= # img src= /jscss/demoimg/wall_s3.jpg  border= 0  / /a
/div
div id= demo2 /div
/div
/div
!--下边是js的编码--
script
!--
var speed=10;
var tab=document.getElementById( demo
var tab1=document.getElementById( demo1
var tab2=document.getElementById( demo2
tab2.innerHTML=tab1.innerHTML;
function Marquee(){
if(tab2.offsetWidth-tab.scrollLeft =0)
tab.scrollLeft-=tab1.offsetWidth
else{
tab.scrollLeft++;
}
}
var MyMar=setInterval(Marquee,speed);
tab. unction() {clearInterval(MyMar)};
tab.onmouseout=function() {MyMar=setInterval(Marquee,speed)};
--
/script
3、历经上边的设定后,照片目录就应当能够横着向左健身运动了。 


dedecms模版,dedecms公司模版,dedecms新闻资讯模版,高档HTML5响应式模版,dedecms手机上模版,织梦cms模版实例教程,网站模版,网页页面模版,完全免费网页页面模版



Copyright © 广州凡科互联网科技有限公司 版权所有 粤ICP备10235580号
全国服务电话:4000-399-000   传真:021-45545458
公司地址:广州市海珠区工业大道北67号凤凰创意园