网页滚动图片窗

rollpic_center.js
var rollwidth = 126;    //每次滚动宽度
var speed=40; //滚动速度
var mymarL //往左滚动事件
var mymarR //往右滚动事件
var Lstopflag=1;
var Rstopflag=1;

scroll_front.innerHTML=scroll_begin.innerHTML
scroll_end.innerHTML=scroll_begin.innerHTML
function marqueeL(){
if (scroll_end.offsetWidth-scroll_div.scrollLeft<=0)
scroll_div.scrollLeft-=scroll_begin.offsetWidth
else{
    if (scroll_div.scrollLeft%rollwidth==(rollwidth-2) && Lstopflag==1) {
        clearInterval(mymarL);
        }
        scroll_div.scrollLeft++;
    }
}
function marqueeR(){
if (scroll_div.scrollLeft<=0)
scroll_div.scrollLeft+=scroll_begin.offsetWidth
else{
    if (scroll_div.scrollLeft%rollwidth==2 && Rstopflag==1) {
        clearInterval(mymarR);
        }
        scroll_div.scrollLeft--;
    }
}

goleft.onmouseover=function(){
clearInterval(mymarL);
clearInterval(mymarR);
Lstopflag=0;
Rstopflag=1;
mymarL=setInterval(marqueeL,speed);
}
/*goleft.onmouseout=function(){
Lstopflag=1;
}*/
goright.onmouseover=function(){
clearInterval(mymarL);
clearInterval(mymarR);
Lstopflag=1;
Rstopflag=0;
mymarR=setInterval(marqueeR,speed);
}
/*goright.onmouseout=function(){
Rstopflag=1;
}*/
scroll_div.onmouseover=function(){

clearInterval(mymarL);
clearInterval(mymarR);
if(Rstopflag==0)
{
Rstopflag=1;
}
else
{
Rstopflag=0;
}
if(Lstopflag==0)
{
Lstopflag=1;
}
else
{
Lstopflag=0;
}
}
scroll_div.onmouseout=function(){

clearInterval(mymarL);
clearInterval(mymarR);
if(Lstopflag==1)
{
    Lstopflag=0;
    mymarR=setInterval(marqueeL,speed);
}
else
{
Lstopflag=1;
}
if(Rstopflag==1)
{
Rstopflag=0;
mymarR=setInterval(marqueeR,speed);
}
else
{
Rstopflag=1;
}
}
clearInterval(mymarL);
clearInterval(mymarR);
Lstopflag=0;
Rstopflag=1;
mymarL=setInterval(marqueeL,speed);
设计
    <tr>
        <td valign="middle" class="td02">
            <table cellspacing="0" cellpadding="0" width="100%" align="center" border="0">
                <tbody>
                    <tr>
                        <td width="15">
                            <div align="center">
                                <img id="goleft" src="../images/icon_01.gif" width="12" height="25" style="cursor: hand;"></div>
                        </td>
                        <td align="center" valign="top">
                            <div id="scroll_div" style="overflow: hidden; width: 680px; height: 130px" align="center">
                                <table height="129" cellspacing="0" cellpadding="0" width="100%" align="center" border="0">
                                    <tbody>
                                        <tr>
                                            <td id="scroll_front">
                                            </td>
                                            <td id="scroll_begin" valign="center" align="middle">
                                                <table cellspacing="3" cellpadding="3" width="100%" align="center" border="0">
                                                    <tbody>
                                                        <tr>
                                                            $looptr sql="select top 10 c.contentid as va,p.filepath as vb,c.title,(cs.htmlfilepath+cs.htmlfilename)as
                                                            vc from dbo.content c inner join contentsubject cs on c.contentid=cs.contentid inner
                                                            join dbo.subject s on s.id=cs.subjectid and s.code='cmjjjc_xjzd_lzmh' inner join
                                                            pubattach p on p.tableid=c.contentid and p.tablename='content' order by c.sequence
                                                            asc,c.starttime desc,c.contentid desc"$
                                                            <td>
                                                                <div align="center">
                                                                    <table cellspacing="0" cellpadding="0" width="100" border="0">
                                                                        <tbody>
                                                                            <tr>
                                                                                <td>
                                                                                    &nbsp;
                                                                                </td>
                                                                                <td>
                                                                                    <a href="$vc$" target="_blank" title="$title$">
                                                                                        <div class="bg_01">
                                                                                            <img alt="$title$" src="http://www.cnblogs.com/../..$vb$" height="111" border="0" /></div>
                                                                                    </a>
                                                                                </td>
                                                                                <td>
                                                                                    &nbsp;&nbsp;
                                                                                </td>
                                                                            </tr>
                                                                        </tbody>
                                                                    </table>
                                                                </div>
                                                            </td>
                                                        </tr>
                                                    </tbody>
                                                </table>
                                            </td>
                                            <td id="scroll_end">
                                            </td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </td>
                        <td width="15">
                            <div align="center">
                                <img id="goright" src="../images/icon_02.gif" width="12" height="25" style="cursor: hand;"></div>
                        </td>
                    </tr>
                </tbody>
            </table>

            <script src="rollpic_center.js" type="text/javascript"></script>

        </td>
    </tr>

 

posted @ 2013-04-18 14:12  梅香萦绕,佳人依偎  阅读(131)  评论(0编辑  收藏  举报