可翻阅上一条、下一条文字切换效果-其它特效-点滴吧

www.diandiba.com

记录点点滴滴，尽在点滴吧

文章

您现在的位置：首页 > 其它特效 > 特效详情

可翻阅上一条、下一条文字切换效果

更新时间：2015/6/19 14:59:25 下载：7005次

<!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>可翻阅上一条下一条的文字广告</title>
<style type="text/css">

</style>
</head>
<body>
<SCRIPT type=text/javascript>
var rollText_k=4; 
var rollText_i=1; 
rollText_tt=setInterval("rollText(1)",8000);
function rollText(a){
clearInterval(rollText_tt);
rollText_tt=setInterval("rollText(1)",8000);
rollText_i+=a;
if (rollText_i>rollText_k){rollText_i=1;}
if (rollText_i==0){rollText_i=rollText_k;}
 for (var j=1; j<=rollText_k; j++){
document.getElementById("rollTextMenu"+j).style.display="none";
 }
document.getElementById("rollTextMenu"+rollText_i).style.display="block";
document.getElementById("pageShow").innerHTML = rollText_i+"/"+rollText_k;
} 
</SCRIPT>
<TABLE height="29" border="0" cellspacing="0" class=rollboder>
  <TBODY>
  <TR>
    <TD height="22" class=rollleft>
      <DIV class=rollTextMenus>
      <DIV id=rollTextMenu1 style="DISPLAY: block"><STRONG>　敬告栏：</STRONG> <A 
      href="#" target="_blank">想找高持量源码么？</A></DIV>
      <DIV id=rollTextMenu2 style="DISPLAY: none"><STRONG>　最新信息：</STRONG> <A 
      href="/" target="_blank">JavaScript特效大全</A></DIV>
      <DIV id=rollTextMenu3 style="DISPLAY: none"><STRONG>　广而告之：</STRONG> <A 
      href="#" target="_blank">精品JavaScript代码</A></DIV>
      <DIV id=rollTextMenu4 style="DISPLAY: none"><STRONG>　时政新闻：</STRONG> <A 
      href="#" target="_blank">庆祝建国60周年</A></DIV>
</DIV></TD>
    <TD class=rollcenter id=pageShow>1/4</TD>
    <TD class=rollright><A title=上一条 href="javascript:rollText(-1);">&#9664;</A> <A title=下一条 href="javascript:rollText(1);">&#9654;</A></TD>
</TR></TBODY></TABLE>
</body>
</html>

预览效果复制代码保存代码提示：可以先修改部分代码后再运行

文字切换效果，点击按钮后转至下一条，可翻阅上一条、下一条文字，可以用来做文字广告。切换条数在JS里修改，要对应你实际的文字条数，否则会出错。

上一个素材：JS Cookies用法示例：记事贴 下一个素材：四代新版旅游网站基本信息调用