discuz开发：滚动、换行、自定义模板名称

发表于 2016-11-25 15:36

马上注册，结交更多好友，享用更多功能，让你轻松玩转社区。

您需要登录才可以下载或查看，没有帐号？注册

x

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<title>图片连续无间隙向左滚动，无间隙向右滚动，符合W3C Web标准_</title>
<meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″ />
</head>
<body>
<div id=”demo” style=”overflow: hidden; width: 322px; height: 61px”>
<table cellpadding=”0″ align=”left” border=”0″ cellspace=”0″>
<tr>
<td id=”demo1″ valign=”top”><table cellspacing=”0″ cellpadding=”0″ width=”322″ bgcolor=”#fffbf7″ border=”0″>
<tr align=”center”>
<td width=”50″ height=”50″><img height=”50″ src=”www.yonfa365.com.jpg” /> </td>
<td width=”50″ height=”50″><img height=”50″ src=”www.yonfa365.com.jpg” /> </td>
<td width=”50″ height=”50″><img height=”50″ src=”www.yonfa365.com.jpg” /> </td>
<td width=”50″ height=”50″><img height=”50″ src=”www.yonfa365.com.jpg” /> </td>
<td width=”50″ height=”50″><img height=”50″ src=”www.yonfa365.com.jpg” /> </td>
</tr>
</table></td>
<td id=”demo2″ valign=”top”></td>
</tr>
</table>
</div>
<div id=”demo0″ style=”overflow: hidden; width: 322px; height: 61px”>
<table cellpadding=”0″ align=”left” border=”0″ cellspace=”0″>
<tr>
<td id=”demo11″ valign=”top”><table cellspacing=”0″ cellpadding=”0″ width=”322″ bgcolor=”#fffbf7″ border=”0″>
<tr align=”center”>
<td width=”50″ height=”50″><img height=”50″ src=”www.yonfa365.com.jpg” /> </td>
<td width=”50″ height=”50″><img height=”50″ src=”www.yonfa365.com.jpg” /> </td>
<td width=”50″ height=”50″><img height=”50″ src=”www.yonfa365.com.jpg” /> </td>
<td width=”50″ height=”50″><img height=”50″ src=”www.yonfa365.com.jpg” /> </td>
<td width=”50″ height=”50″><img height=”50″ src=”www.yonfa365.com.jpg” /> </td>
</tr>
</table></td>
<td id=”demo22″ valign=”top”></td>
</tr>
</table>
</div>
<script type=”text/javascript” language=”JavaScript”>
//调用向左滚动
toleft(“demo”,”demo1″,”demo2″,30,”hehe123″)
//调用向右滚动
toright(“demo0″,”demo11″,”demo22″,20,”hehe1123″)
function $(id){return document.getElementById(id)}
//向左滚动函数，demo包含demo1与demo2,speed是滚动速度，flag一个网页内有多个时设置为不同的任意字符。
//by 柳永法(yongfa365)’Blog　www.yongfa365.com
function toleft(demo,demo1,demo2,speed,flag){
demo=$(demo);demo1=$(demo1);demo2=$(demo2)
demo2.innerHTML=demo1.innerHTML
function Marquee(){
if(demo2.offsetWidth-demo.scrollLeft<=0){
demo.scrollLeft-=demo1.offsetWidth
}
else{
demo.scrollLeft++
}
}
flag=setInterval(Marquee,speed)
demo.onmouseover=function(){clearInterval(flag);}
demo.onmouseout=function(){flag=setInterval(Marquee,speed);}
}
//向右滚动函数，demo包含demo1与demo2,speed是滚动速度，flag一个网页内有多个时设置为不同的任意字符。
//by 柳永法(yongfa365)’Blog　www.yongfa365.com
function toright(demo,demo1,demo2,speed,flag){
demo=$(demo);demo1=$(demo1);demo2=$(demo2)
demo2.innerHTML=demo1.innerHTML
function Marquee(){
if(demo.scrollLeft<=0){
demo.scrollLeft=demo2.offsetWidth
}
else{
demo.scrollLeft–
}
}
flag=setInterval(Marquee,speed)
demo.onmouseover=function(){clearInterval(flag);}
demo.onmouseout=function(){flag=setInterval(Marquee,speed);}
}
</script>
</body>
</html>

二、门户自定义模板名称：

在模板里面加：
<!–[name]这就是你你模板后台显示的名称[/name]–>

三、宽度不够时，文字自动换行：

强制不换行
div{
white-space:nowrap;
}
自动换行
div{
word-wrap: break-word;
word-break: normal;
}
强制英文单词断行
div{
word-break:break-all;
}

转载请保留当前帖子的链接：https://www.beimeilife.com/thread-36732-1-1.html 谢谢

[学习借鉴] discuz开发：滚动、换行、自定义模板名称

马上注册，结交更多好友，享用更多功能，让你轻松玩转社区。

你喜欢看

使用高级回帖 (可批量传图、插入视频等)快速回复