zoukankan      html  css  js  c++  java
  • 代码收藏 javascript 图片滚动代码

    1、横向无间断滚动

    <!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>
    </head>
    <body>
        
    <table width="700" border="0" cellpadding="0" cellspacing="0">
            
    <tr>
                
    <td>
                    
    <div id="www_qpsh_com" style="overflow: hidden; height: 120px;  700px; color: #ff0000">
                        
    <table align="left" cellpadding="0" cellspacing="0" border="0">
                            
    <tr>
                                
    <td id="www_qpsh_com1" valign="top">
                                    
    <table border="0" cellpadding="0" cellspacing="0">
                                        
    <tr>
                                            
    <td>
                                                
    <href="http://www.qpsh.com/javascript/showpage2443.htm" target="_blank">
                                                    
    <img border="0" src="http://www.qpsh.com/icon/BS9097.jpg" width="150" height="100"
                                                        hspace
    ="22"></a><br>
                                                
    <center>
                                                    
    <b>说明一</b></center>
                                            
    </td>
                                            
    <td width="30">
                                            
    </td>
                                            
    <td>
                                                
    <href="http://www.qpsh.com" target="_blank">
                                                    
    <img border="0" src="http://www.qpsh.com/icon/BS9092.jpg" width="150" height="100"
                                                        hspace
    ="22"></a><br>
                                                
    <center>
                                                    
    <b>说明二</b></center>
                                            
    </td>
                                            
    <td width="30">
                                            
    </td>
                                            
    <td>
                                                
    <href="http://www.3sdo.com" target="_blank">
                                                    
    <img border="0" src="http://www.qpsh.com/icon/BS9084.jpg" width="150" height="100"
                                                        hspace
    ="22"></a><br>
                                                
    <center>
                                                    
    <b>说明三</b></center>
                                            
    </td>
                                            
    <td width="30">
                                            
    </td>
                                            
    <td>
                                                
    <href="http://www.sanguo5.com" target="_blank">
                                                    
    <img border="0" src="http://www.qpsh.com/icon/BS9079.jpg" width="150" height="100"
                                                        hspace
    ="22"></a><br>
                                                
    <center>
                                                    
    <b>说明四</b></center>
                                            
    </td>
                                            
    <td width="30">
                                            
    </td>
                                            
    <td>
                                                
    <href="http://www.pc555.com" target="_blank">
                                                    
    <img border="0" src="http://www.qpsh.com/icon/BS9070.jpg" width="150" height="100"
                                                        hspace
    ="22"></a><br>
                                                
    <center>
                                                    
    <b>说明五</b></center>
                                            
    </td>
                                        
    </tr>
                                    
    </table>
                                
    </td>
                                
    <td id="www_qpsh_com2" valign="top">
                                
    </td>
                            
    </tr>
                        
    </table>
                    
    </div>
                
    </td>
            
    </tr>
        
    </table>

        
    <script type="text/javascript">
            
    var speedMy = 10//速度数值越大速度越慢
            www_qpsh_com2.innerHTML = www_qpsh_com1.innerHTML
            
    function Marquee1() {
                
    if (www_qpsh_com2.offsetWidth - www_qpsh_com.scrollLeft <= 0)
                    www_qpsh_com.scrollLeft 
    -= www_qpsh_com1.offsetWidth
                
    else {
                    www_qpsh_com.scrollLeft
    ++
                }
            }
            
    var MyMar1 = setInterval(Marquee1, speedMy)
            www_qpsh_com.onmouseover 
    = function() { clearInterval(MyMar1) }
            www_qpsh_com.onmouseout 
    = function() { MyMar1 = setInterval(Marquee1, speedMy) }
        
    </script>

    </body>
    </html>
  • 相关阅读:
    MyBatis3-实现多表关联数据的查询
    MyBatis3-实现单表数据的增删查改
    MyBatis3-以接口方式编程
    如何识别人的技术能力和水平?
    评审的艺术——谈谈现实中的代码评审 专题
    Spring编程式和声明式事务实例讲解
    Spring Webflux: Kotlin DSL [片断]
    Spring3.1 对Bean Validation规范的新支持(方法级别验证)
    Android setImageResource与setImageBitmap的区别
    Android开发中,9-patch (九宫格)图片作为背景带来的问题
  • 原文地址:https://www.cnblogs.com/heimirror/p/1505813.html
Copyright © 2011-2022 走看看