织梦图片无缝横向滚动

用织梦建站时,有时可能需要完成一排图片横向无缝滚动的效果,经常用到这种样式的有产品展示,其实做出无缝的图片横向滚动很简单。懒鸟飞整理一下从网上查到的一个js代码的使用方法如下:
       用织梦建站时,有时可能需要完成一排图片横向无缝滚动的效果,经常用到这种样式的有产品展示,其实做出无缝的图片横向滚动很简单。跟版网整理一下从网上查到的一个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、把下面代码放到需要滚动的图片列表的位置,其中红色代码的部分可以替换成织梦的图片列表代码。

<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.onmouseover=function() {clearInterval(MyMar)};
tab.onmouseout=function() {MyMar=setInterval(Marquee,speed)};
-->
</script>

3、经过上面的设置后,图片列表就应该可以横向向左运动了。
本站部分内容来源互联网,如果有图片或者内容侵犯您的权益请联系我们删除!

相关文档推荐

dedecms织梦无需登录注册可下单购买的修改,首先找到/plus/carbuaction.php文件,找到如下代码: //确认用户登录信息if($cfg_ml-IsLogin()){ $userid = $cfg_ml-M_ID;}else{ $username = trim($username); $password = trim($password); if(empty($username)
用过织梦dedecms的人都知道,织梦会员系统相当强大,跟论坛程序差不多,对于使用会员系统的人来说,织梦系统足够用的了,但是,有时候,织梦系统很多的地方又不是我们所希望,或都说,有的地方不适合我们使用,这时候就要对织梦会员系统进行二次开发,所以,
我们在做 织梦模板 开发时,有时需要在artlist 和list标签中调用出图集中的图片,同时可以自定调用几张图片。跟版网整理了个一个这样功能的自定义函数。调用后效果如下: dedecms织梦artlist和list标签调用图集图片实现方法 函数代码 请将代码加入到 /includ
大家都知道,Discuz程序在发文章时有个【隐藏】功能,可以限制这个隐藏内容供某些级别的会员查看。 在织梦模板中,做些改动,也是可以实现的。例如:电话号码,下载地址等等。 前提是织梦开启会员功能,已经有了自定义字段。 一、建立文件 ajax_loginsta_c.p
大家在使用织梦的时候,用到会员中心可能涉及到多二级域名同步登录退出的问题,涉及到跨域,那么这个问题该如何解决呢?在一个技术大牛博客看到过此教程,特此转发分享给大家,解决大家问题。 首先打开 \include\dedeajax2.js 找到 DedeXHTTP = new XMLHttpR
大家在使用织梦标签调用手机站内容页上一篇下一篇的时候,发现下一篇调用的是上一篇的内容,织梦DEDE默认手机版内容页面点击下一篇却跳转到了上一篇怎么办? 这段代码可能是官方写错造成的,首先找到网站目录下面的/include/arc.archives.class.php文件,打