jQuery字幕滚动特效（原创）


    重
载
    收
起
    
        

        

        

        
            
                
                    2018-02-15 14:52:23 DangerousObject.Multi.Generic 80 dck 
                
                
                    2018-02-25 15:55:13 HackTool.MSIL.KMSAuto.bq 8080 tcp 
                
                
                    2018-03-10 10:52:33 Trojan.Win32.AutoRun.gen 443 udp 
                
                
                    2018-04-15 14:12:23 DangerousObject.Multi.Generic 225 tmp 
                
                
                    2018-05-03 12:51:53 DangerousObject.Multi.Generic 21 dcp 
                

                
                    2018-02-15 14:52:23 DangerousObject.Multi.Generic 80 dck 
                
                
                    2018-02-25 15:55:13 HackTool.MSIL.KMSAuto.bq 8080 tcp 
                
                
                    2018-03-10 10:52:33 Trojan.Win32.AutoRun.gen 443 udp 
                
                
                    2018-04-15 14:12:23 DangerousObject.Multi.Generic 225 tmp 
                
                
                    2018-05-03 12:51:53 DangerousObject.Multi.Generic 21 dcp 
                

                
                    2018-02-15 14:52:23 DangerousObject.Multi.Generic 80 dck 
                
                
                    2018-02-25 15:55:13 HackTool.MSIL.KMSAuto.bq 8080 tcp 
                
                
                    2018-03-10 10:52:33 Trojan.Win32.AutoRun.gen 443 udp 
                
                
                    2018-04-15 14:12:23 DangerousObject.Multi.Generic 225 tmp 
                
                
                    2018-05-03 12:51:53 DangerousObject.Multi.Generic 21 dcp 
                

                
                    2018-02-15 14:52:23 DangerousObject.Multi.Generic 80 dck 
                
                
                    2018-02-25 15:55:13 HackTool.MSIL.KMSAuto.bq 8080 tcp 
                
                
                    2018-03-10 10:52:33 Trojan.Win32.AutoRun.gen 443 udp 
                
                
                    2018-04-15 14:12:23 DangerousObject.Multi.Generic 225 tmp 
                
                
                    2018-05-03 12:51:53 DangerousObject.Multi.Generic 21 dcp

* {
	margin:0;
	padding:0;
	list-style:none;
	float:left
}
#content {
	width:250px;
	height:420px;
	position:relative;
	overflow:hidden;
	-webkit-transform:rotate(-90deg);
	margin-top:-90px;
	margin-left:130px;
}
#content ul {
	width:300px;
	height:480px;
	position:absolute;
	text-align:left;
}
#content ul:hover,.h33:hover {
	cursor:pointer;
}
#content ul li {
	width:30px;
	height:480px;
}
#content ul li div {
	-webkit-transform:rotate(90deg);
	margin-top:230px;
	width:480px;
}
body {
	background:darkorange;
}

window.onload = function() {
     var content = document.getElementById("content")
     var ul = content.getElementsByTagName("ul")[0]
     var li = ul.getElementsByTagName("li")
     var speed = 1;
     ul.innerHTML += ul.innerHTML
     ul.style.width = li.length * li[0].offsetWidth + "px"

function run() {
         if (ul.offsetLeft < -ul.offsetWidth / 2) {
             ul.style.left = 0
         } else if (ul.offsetLeft > 0) {
             ul.style.left = -ul.offsetWidth / 2 + "px"
         }
         ul.style.left = ul.offsetLeft + speed + "px"
     }
     timer = setInterval(run, 30)
     content.onmouseover = function() {
         clearInterval(timer)
     }
     content.onmouseout = function() {
         timer = setInterval(run, 30)
     }
 }

$(function() {
     $("#d2").click(function() {
         $("#d1").slideToggle(1500);
     });
     $("p").animate({ 
         scrollTop: $(document).height()
     }, 50);

$("#d3").click(function() {
         $("#content").html("<ul>" +
             "<li><div>2018-02-15 14:52:23 DangerousObject.Multi.Generic  80    dck  </div></li>" +
             "<li><div>2018-02-25 15:55:13 HackTool.MSIL.KMSAuto.bq       8080  tcp  </div></li>" +
             "<li><div>2018-03-10 10:52:33 Trojan.Win32.AutoRun.gen       443   udp  </div></li>" +
             "<li><div>2018-04-15 14:12:23 DangerousObject.Multi.Generic  225   tmp  </div></li>" +
             "<li><div>2018-05-03 12:51:53 DangerousObject.Multi.Generic  21    dcp  </div></li>" +

"<li><div>2018-02-15 14:52:23 DangerousObject.Multi.Generic  80    dck  </div></li>" +
             "<li><div>2018-02-25 15:55:13 HackTool.MSIL.KMSAuto.bq       8080  tcp  </div></li>" +
             "<li><div>2018-03-10 10:52:33 Trojan.Win32.AutoRun.gen       443   udp  </div></li>" +
             "<li><div>2018-04-15 14:12:23 DangerousObject.Multi.Generic  225   tmp  </div></li>" +
             "<li><div>2018-05-03 12:51:53 DangerousObject.Multi.Generic  21    dcp  </div></li>" +

"<li><div>2018-02-15 14:52:23 DangerousObject.Multi.Generic  80    dck  </div></li>" +
             "<li><div>2018-02-25 15:55:13 HackTool.MSIL.KMSAuto.bq       8080  tcp  </div></li>" +
             "<li><div>2018-03-10 10:52:33 Trojan.Win32.AutoRun.gen       443   udp  </div></li>" +
             "<li><div>2018-04-15 14:12:23 DangerousObject.Multi.Generic  225   tmp  </div></li>" +
             "<li><div>2018-05-03 12:51:53 DangerousObject.Multi.Generic  21    dcp  </div></li>" +
             "</ul>");

var content = document.getElementById("content")
         var ul = content.getElementsByTagName("ul")[0]
         var li = ul.getElementsByTagName("li")
         var speed = 1;

ul.innerHTML += ul.innerHTML
         ul.style.width = li.length * li[0].offsetWidth + "px"

function run() {
             if (ul.offsetLeft < -ul.offsetWidth / 2) {
                 ul.style.left = 0
             } else if (ul.offsetLeft > 0) {
                 ul.style.left = -ul.offsetWidth / 2 + "px"
             }
             ul.style.left = ul.offsetLeft + speed + "px"
         }
         timer = setInterval(run, 30)
         content.onmouseover = function() {
             clearInterval(timer)
         }
         content.onmouseout = function() {
             timer = setInterval(run, 30)
         }
     });
 });

PROMULGATOR

ry2015

相关代码

jQuery字幕滚动特效（原创）

最新