当前位置:编程学习 > C#/ASP.NET >>

公告栏 公告为什么不滚动?

这是页面代码

<div style=" height:80px; margin:0 15px;overflow:hidden;" id="shopAffiche">
                        
                        <asp:Repeater ID="rpBulletinList" runat="server">
                            <ItemTemplate>
                                <ul>
                                     <li>
                                         <div style="overflow: hidden;">
                                             <ul class="affiche_Content">
                                                 <li>
                                                 
                                                 <a href="BulletinInfo/BulletinInfo.aspx?Id=<%# Eval("Id")%>" title="<%# Eval("BulletinTitle")%>" target="_blank"><%# Eval("BulletinTitle")%></a></li>
                                                

                                             </ul>
                                         </div>
                                     </li>
                                 </ul>
                            </ItemTemplate>
                        </asp:Repeater>
                     </div>

 <script type="text/javascript" src="Js/MainJs.js">
                try{
                      slideLine('shopAffiche', 3000, 5, 20);
                    }catch(e) {}
                
                </script>



Js/MainJs.js 中的代码
/*公告*/
function slideLine(ul, delay, speed, lh) {
var slideBox = (typeof ul == 'string')?document.getElementById(ul):ul;
var delay = delay||1000, speed=speed||20, lh = lh||20;
var tid = null, pause = false;
var start = function() {
tid=setInterval(slide, speed);
}
var slide = function() {
if (pause) return;
slideBox.scrollTop += 2;
if (slideBox.scrollTop % lh == 0) {
clearInterval(tid);
slideBox.appendChild(slideBox.getElementsByTagName('li')[0]);
slideBox.scrollTop = 0;
setTimeout(start, delay);
}
}
slideBox.onmouseover=function(){pause=true;}
slideBox.onmouseout=function(){pause=false;}
setTimeout(start, delay);
  }


为什么公告栏信息显示了 确不滚动呢?  


请大家帮帮忙   谢谢!!! --------------------编程问答-------------------- 不太明白你那段JQ的意思,不够要滚动的效果,我做了一个例子,marquee可以实现

<marquee behavior="scroll" onmousemove="this.stop()" onmouseout="this.start()" direction="up"
                        loop="-1" scrollamount="1" scrolldelay="1" height="180">
                        <ul>
                       <asp:Repeater ID="dNew" runat="server">
                                <ItemTemplate>
                                    <li>
                                    <a href="NewDetail.aspx?newID=<%#Eval("new_id")%>" target="_parent">
                                        <%#titleS(Eval("title"))%></a><span><%# SeeTime(Eval("Opentime"))%></span>
                                        </li>
                                </ItemTemplate></asp:Repeater>
                        </ul></marquee>
--------------------编程问答--------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
        <title>My Marquee Halign</title>
        <style>
 
/*My Marquee CSS Start*/ 
.my_marquee_info{width:200px;border:#987654 solid 1px;padding:20px 3px 3px 2px;margin-top:30px;} 
.my_marquee_main{width:200px;height:160px;border:#234567 solid 1px;padding:2px 3px 3px 2px;overflow:hidden;} 
.my_marquee_div1{width:195px;border:Green solid 1px;} 
.my_marquee_div2{width:195px;border:Red solid 1px;} 
/*My Marquee CSS End*/ 
</style>
        <div id="www_qpsh_com" style="overflow: hidden; height: 140px; width: 800px;">
            <table align="left" border="0" cellpadding="0" cellspace="0">
                <tr>
                    <td id="www_qpsh_com1" valign="top">
                        <table border="0" cellpadding="0" cellspacing="10">
                            <tr>
                                <td align="center" height="96" style="background-color:Green;" title="我是第一个" 
                                    valign="middle">
                                    <img border="0" height="100" hspace="11" src="7005658357973.jpg" vspace="5" 
                                        width="150" />
                                    <center>
                                        1</center>
                                </td>
                                <td align="center" height="96" valign="middle">
                                    <img border="0" height="100" hspace="11" src="7000940554735.jpg" vspace="5" 
                                        width="150" />
                                    <center>
                                        2</center>
                                </td>
                                <td align="center" height="96" valign="middle">
                                    <img border="0" height="100" hspace="11" src="7000840962304.jpg" vspace="5" 
                                        width="150" />
                                    <center>
                                        3</center>
                                </td>
                                <td align="center" height="96" valign="middle">
                                    <img border="0" height="100" hspace="11" src="7000746023064.jpg" vspace="5" 
                                        width="150" />
                                    <center>
                                        4</center>
                                </td>
                                <td align="center" height="96" style="background-color:Red;" title="我是最后一个" 
                                    valign="middle">
                                    <img border="0" height="100" hspace="11" src="7000556611956.jpg" vspace="5" 
                                        width="150" />
                                    <center>
                                        5</center>
                                </td>
                            </tr>
                        </table>
                    </td>
                    <td id="www_qpsh_com2" valign="top">
                    </td>
                </tr>
            </table>
        </div>
        <div id="my_marquee_info" class="my_marquee_info">
        </div>




http://wenku.baidu.com/view/c5995ced4afe04a1b071ded2.html --------------------编程问答--------------------
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>图片向右滚动,鼠标经过停留,鼠标移出继续滚动</title>
    <style type="text/css">
        #demo{width:900px;height:250px;overflow:hidden;}
        #demo img{float:left;margin-right:5px;}
        #indemo{width:400%}
        #demo1{float:left;}
        #demo2{float:left}
    </style>
</head>
<body>
<div id="demo">
    <div id="indemo">
        <div id="demo1">
            <img src="images/p001.jpg" />
            <img src="images/p002.jpg" />
            <img src="images/p003.jpg" />
            <img src="images/p004.jpg" />
            <img src="images/p005.jpg" />
            <img src="images/p006.jpg" />
            <img src="images/p007.jpg" />
            <img src="images/p008.jpg" />
            <img src="images/p009.jpg" />
        </div>
        <div id="demo2"></div>
    </div>
</div>
<script type="text/javascript">
    var tab = document.getElementById("demo");
    var tab1 = document.getElementById("demo1");
    var tab2 = document.getElementById("demo2");
    tab2.innerHTML = tab1.innerHTML;
    function scroll(){
        if(tab2.offsetLeft-tab.scrollLeft<=0)
            tab.scrollLeft-=tab2.offsetLeft;
        else 
            tab.scrollLeft++;
    }
    var Mar = setInterval(scroll,10);
    tab.onmouseover=function(){clearInterval(Mar)}
    tab.onmouseout=function(){Mar=setInterval(scroll,10)}
</script>
</body>
</html>
--------------------编程问答-------------------- 向上
<div class="lefttop1"><a href="/new/Default.aspx?classid=12" class="a4" >本站公告</a></div>
<div class="midtop1">
<script> 
    var marqueeContent = new Array();   //滚动主题
    marqueeContent[0]='<a href="/new/13053.htm"></a>';
    var marqueeInterval = new Array();  //定义一些常用而且要经常用到的变量
    var marqueeId = 0;
    var marqueeDelay = 4000;
    var marqueeHeight = 15;
    function initMarquee() {
        var str = marqueeContent[0];
        document.write('<div id=marqueeBox style="overflow:hidden;height:' + marqueeHeight + 'px" onmouseover="clearInterval(marqueeInterval[0])" onmouseout="marqueeInterval[0]=setInterval(\'startMarquee()\',marqueeDelay)"><div>' + str + '</div></div>');
        marqueeId++;
        marqueeInterval[0] = setInterval("startMarquee()", marqueeDelay);
    }
    function startMarquee() {
        var str = marqueeContent[marqueeId];
        marqueeId++;
        if (marqueeId >= marqueeContent.length) marqueeId = 0;
        if (marqueeBox.childNodes.length == 1) {
            var nextLine = document.createElement('DIV');
            nextLine.innerHTML = str;
            marqueeBox.appendChild(nextLine);
        }
        else {
            marqueeBox.childNodes[0].innerHTML = str;
            marqueeBox.appendChild(marqueeBox.childNodes[0]);
            marqueeBox.scrollTop = 0;
        }
        clearInterval(marqueeInterval[1]);
        marqueeInterval[1] = setInterval("scrollMarquee()", 10);
    }
    function scrollMarquee() {
        marqueeBox.scrollTop++;
        if (marqueeBox.scrollTop % marqueeHeight == marqueeHeight) {
            clearInterval(marqueeInterval[1]);
        }
    }
    initMarquee();
</script>

  <script type=text/javascript>
      var speed = 30
      marquePic2.innerHTML = marquePic1.innerHTML
      function Marquee() {
          if (demo.scrollLeft >= marquePic1.scrollWidth) {
              demo.scrollLeft = 0
          } else {
              demo.scrollLeft++
          } 
      }
      var MyMar = setInterval(Marquee, speed)
      demo.onmouseover = function() { clearInterval(MyMar) }
      demo.onmouseout = function() { MyMar = setInterval(Marquee, speed) } 
  </script>
 
--------------------编程问答-------------------- 用marquee那个不就可以了么?如果需要用js的话,你要算好每次移动多少,移动完了(到一端了)怎么处理。这个比较麻烦 --------------------编程问答-------------------- 现成的例子很多,没必要自己写。
补充:.NET技术 ,  ASP.NET
CopyRight © 2012 站长网 编程知识问答 www.zzzyk.com All Rights Reserved
部份技术文章来自网络,