Ecshop模板网
首页 > ecshop教程 > ecshop经验分享 > Ecshop模板制作_让首页“站内快讯”垂直滚动显示
文章详情

Ecshop模板制作_让首页“站内快讯”垂直滚动显示

ecshop模板网 / 2011-01-16

Ecshop首页“站内快讯”默认是静止不动的,很多人想让它垂直滚动显示,这里简要说一下方法
如果只是要简单的垂直滚动 用 html 标签中的 <maquee> 就能实现,但是不能实现无缝结合。
如果想要无缝垂直滚动,就需要一点JS代码的支持。

下面就讲一讲如何实现“站内快讯”垂直无缝滚动显示:

将 library/new_articles.lbi 文件内容完全替换为下面代码即可:
(经测试完全兼容IE6,IE7,FIREFOX)

注意:下面方法已经在官方默认模板基础上测试完全通过,其他模板没做测试。

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<div id="artup" style="overflow:hidden; height: 170px;">
<div id="artup1">
<ul style="padding:0;margin:0" id="artup1ul">
<!--{foreach name="new_articles" from=$new_articles item=article}-->
<li>
[<a href="{$article.cat_url}">{$article.cat_name}</a>] <a href="{$article.url}" title="{$article.title|escape:html}">{$article.short_title|truncate:10:"...":true}</a>
</li>
<!--{/foreach}-->
</ul>
</div>
<div id="artup2"> </div>
</div>
<script type="text/javascript">
var speed=30;
var ARTUP=document.getElementById('artup');
var ARTUP1=document.getElementById('artup1');
var ARTUP2=document.getElementById('artup2');
var ARTUP1ul=document.getElementById('artup1ul');
var result = "";
for(var i=0; i<25; i++) result += ARTUP1ul.innerHTML;
ARTUP1ul.innerHTML=result
ARTUP2.innerHTML=ARTUP1.innerHTML
function Marquee1(){
if(ARTUP2.offsetHeight-ARTUP.scrollTop<=0)
ARTUP.scrollTop-=ARTUP1.offsetHeight
else{
ARTUP.scrollTop++
}
}
var MyMar1=setInterval(Marquee1,speed)
ARTUP.onmouseover=function() {clearInterval(MyMar1)}
ARTUP.onmouseout=function() {MyMar1=setInterval(Marquee1,speed)}
</script>
下一篇: 屏蔽ecshop云提示no_license 上一篇: 在Ecshop首页上显示最新评论
 用户评论(共 0 条评论)
  • 暂时还没有任何用户评论
用户名: 匿名用户 E-mail:
当前心情:
评论内容:
验证码: captcha
返回顶部 返回首页
 
QQ在线咨询
售前电话热线
130-5800-8007
售前QQ客服