phpStudy
phpStudy
网站首页
软件下载
PHP教程
编程技术
PHP
MySQL
HTML
CSS
JavaScript
MSSQL
AJAX
.NET
JSP
window
Linux
Mac
ASP
服务器
CMS
SQL
jQuery
C#
C++
java
Android
IOS
oracle
MongoDB
PostgreSQL
SQLite
教程手册
php
html
html5
css
css3
JavaScript
ajax
jquery
sql
ado
asp
aspnet
browsers
careers
dhtml
dotnetmobile
dtd
e4x
glossary
hosting
htmldom
json
media
msnet
quality
rdf
rss
schema
semweb
site
sitemap
smil
soap
svg
tags
tcpip
vbscript
w3c
wap
web
webservices
wmlscript
wsdl
xforms
xhtml
xlink
xml
xmldom
xpath
xquery
xsl
xslfo
网站测速
小皮面板
智能dns
搜索
首页
PHP教程
可左右平滑滚动的产品展示效果
可左右平滑滚动的产品展示效果
<!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> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>图片</title> <script language="javascript"> <!-- //图片滚动列表 mengjia 070927 var Speed_1 = 10; //速度(毫秒) var Space_1 = 20; //每次移动(px) var PageWidth_1 = 116 * 3; //翻页宽度 var interval_1 = 7000; //翻页间隔 var fill_1 = 0; //整体移位 var MoveLock_1 = false; var MoveTimeObj_1; var MoveWay_1="right"; var Comp_1 = 0; var AutoPlayObj_1=null; function GetObj(objName){if(document.getElementById){return eval('document.getElementById("'+objName+'")')}else{return eval('document.all.'+objName)}} function AutoPlay_1(){clearInterval(AutoPlayObj_1);AutoPlayObj_1=setInterval('ISL_GoDown_1();ISL_StopDown_1();',interval_1)} function ISL_GoUp_1(){if(MoveLock_1)return;clearInterval(AutoPlayObj_1);MoveLock_1=true;MoveWay_1="left";MoveTimeObj_1=setInterval('ISL_ScrUp_1();',Speed_1);} function ISL_StopUp_1(){if(MoveWay_1 == "right"){return};clearInterval(MoveTimeObj_1);if((GetObj('ISL_Cont_1').scrollLeft-fill_1)%PageWidth_1!=0){Comp_1=fill_1-(GetObj('ISL_Cont_1').scrollLeft%PageWidth_1);CompScr_1()}else{MoveLock_1=false} AutoPlay_1()} function ISL_ScrUp_1(){if(GetObj('ISL_Cont_1').scrollLeft<=0){GetObj('ISL_Cont_1').scrollLeft=GetObj('ISL_Cont_1').scrollLeft+GetObj('List1_1').offsetWidth} GetObj('ISL_Cont_1').scrollLeft-=Space_1} function ISL_GoDown_1(){clearInterval(MoveTimeObj_1);if(MoveLock_1)return;clearInterval(AutoPlayObj_1);MoveLock_1=true;MoveWay_1="right";ISL_ScrDown_1();MoveTimeObj_1=setInterval('ISL_ScrDown_1()',Speed_1)} function ISL_StopDown_1(){if(MoveWay_1 == "left"){return};clearInterval(MoveTimeObj_1);if(GetObj('ISL_Cont_1').scrollLeft%PageWidth_1-(fill_1>=0?fill_1:fill_1+1)!=0){Comp_1=PageWidth_1-GetObj('ISL_Cont_1').scrollLeft%PageWidth_1+fill_1;CompScr_1()}else{MoveLock_1=false} AutoPlay_1()} function ISL_ScrDown_1(){if(GetObj('ISL_Cont_1').scrollLeft>=GetObj('List1_1').scrollWidth){GetObj('ISL_Cont_1').scrollLeft=GetObj('ISL_Cont_1').scrollLeft-GetObj('List1_1').scrollWidth} GetObj('ISL_Cont_1').scrollLeft+=Space_1} function CompScr_1(){if(Comp_1==0){MoveLock_1=false;return} var num,TempSpeed=Speed_1,TempSpace=Space_1;if(Math.abs(Comp_1)<PageWidth_1/2){TempSpace=Math.round(Math.abs(Comp_1/Space_1));if(TempSpace<1){TempSpace=1}} if(Comp_1<0){if(Comp_1<-TempSpace){Comp_1+=TempSpace;num=TempSpace}else{num=-Comp_1;Comp_1=0} GetObj('ISL_Cont_1').scrollLeft-=num;setTimeout('CompScr_1()',TempSpeed)}else{if(Comp_1>TempSpace){Comp_1-=TempSpace;num=TempSpace}else{num=Comp_1;Comp_1=0} GetObj('ISL_Cont_1').scrollLeft+=num;setTimeout('CompScr_1()',TempSpeed)}} function picrun_ini(){ GetObj("List2_1").innerHTML=GetObj("List1_1").innerHTML; GetObj('ISL_Cont_1').scrollLeft=fill_1>=0?fill_1:GetObj('List1_1').scrollWidth-Math.abs(fill_1); GetObj("ISL_Cont_1").onmouseover=function(){clearInterval(AutoPlayObj_1)} GetObj("ISL_Cont_1").onmouseout=function(){AutoPlay_1()} AutoPlay_1(); } //产品展示滚动图片结束 //--> </script> <style type="text/css"> <!-- BODY { BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; FONT-SIZE: 12px; BORDER-BOTTOM-WIDTH: 0px; MARGIN: 0px; FONT-FAMILY: 宋体; BACKGROUND-COLOR: #fff; BORDER-RIGHT-WIDTH: 0px } .blk_18 { BORDER-RIGHT: #e3e3e3 1px solid; BORDER-TOP: #e3e3e3 1px solid; MARGIN-TOP: 8px; FONT-SIZE: 12px; BACKGROUND: #f3f3f3; OVERFLOW: hidden; BORDER-LEFT: #e3e3e3 1px solid; WIDTH: 390px; BORDER-BOTTOM: #e3e3e3 1px solid; ZOOM: 1 } .blk_18 .pcont { FLOAT: left; OVERFLOW: hidden; WIDTH: 350px } .blk_18 .ScrCont { WIDTH: 32766px; ZOOM: 1 } .blk_18 #List1_1 { FLOAT: left } .blk_18 #List2_1 { FLOAT: left } .blk_18 .LeftBotton { BACKGROUND: url(/upload/20090330141745204.gif) no-repeat; FLOAT: left; MARGIN: 10px 1px; WIDTH: 15px; HEIGHT: 72px } .blk_18 .RightBotton { BACKGROUND: url(/upload/20090330141745204.gif) no-repeat; FLOAT: left; MARGIN: 10px 1px; WIDTH: 15px; HEIGHT: 72px } .blk_18 .LeftBotton { BACKGROUND-POSITION: 0px 0px; MARGIN-LEFT: 5px } .blk_18 .RightBotton { BACKGROUND-POSITION: 0px -100px; MARGIN-LEFT: -1px } .blk_18 .LeftBotton:hover { BACKGROUND-POSITION: -20px 0px } .blk_18 .RightBotton:hover { BACKGROUND-POSITION: -20px -100px } .blk_18 .pl IMG { DISPLAY: block; MARGIN: 6px auto 1px; CURSOR: pointer; BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BORDER-BOTTOM-STYLE: none } .blk_18 .pl { BORDER-RIGHT: #f3f3f3 1px solid; BORDER-TOP: #f3f3f3 1px solid; FLOAT: left; BORDER-LEFT: #f3f3f3 1px solid; WIDTH: 114px; LINE-HEIGHT: 24px; BORDER-BOTTOM: #f3f3f3 1px solid; TEXT-ALIGN: center; TEXT-DECORATION: underline } .blk_18 A.pl:hover { BORDER-RIGHT: #ff9900 1px solid; BORDER-TOP: #ff9900 1px solid; BACKGROUND: #fff; BORDER-LEFT: #ff9900 1px solid; COLOR: #ff9900; BORDER-BOTTOM: #ff9900 1px solid } .commu_cont3 { MARGIN: 9px 7px 7px; LINE-HEIGHT: 150% } .commu_cont3 UL { WIDTH: 188px } --> </style> </head> <body> <!-- picrotate_left start --> <DIV class=blk_18>美女小凡最新夏装韩国人气小耳环3万6超值装修88平牛干巴敲开财富门4K至7K高性能本本7万装修102平婚房最新小车节油为主热门项目 BT烤翅要显瘦就这么穿！ <!-- piclist end --></DIV> <DIV id=List2_1></DIV></DIV></DIV>如需引入外部Js需刷新才能执行]</div> <hr> <span class="prev">« </span><br> <span class="next">» </span> <hr> <table> </table> </div> </div> </div><!--/.col-xs-6.col-lg-4--> <div class="col-md-4"> <div class="panel panel-default"> <div class="panel-heading"> <a href="/php/">PHP教程</a></div> <div class="list-group"> <a href="/php/1.html" class="list-group-item">PHP简介</a> <a href="/php/8.html" class="list-group-item">PHP基本语法</a> <a href="/php/12.html" class="list-group-item">PHP类型</a> <a href="/php/24.html" class="list-group-item">PHP变量</a> <a href="/php/34.html" class="list-group-item">PHP运算符</a> <a href="/php/47.html" class="list-group-item">PHP控制结构</a> <a href="/php/67.html" class="list-group-item">PHP函数</a> <a href="/php/74.html" class="list-group-item">PHP类与对象</a> <a href="/php/110.html" class="list-group-item">PHP异常处理</a> <a href="/php/function.php" class="list-group-item">函数库分类</a> </div> </div> </div> </div><!--/row--> <!--div style="margin:0 auto;clear:both;text-align:center;width:970px;margin-bottom:8px;"></div--> <div class="panel panel-default"> <div class="panel-heading">快速导航</div> <div class="panel-body"> <a href="/list.php?id=1">PHP</a> <a href="/list.php?id=2">MySQL</a> <a href="/list.php?id=3">HTML</a> <a href="/list.php?id=4">CSS</a> <a href="/list.php?id=5">JavaScript</a> <a href="/list.php?id=6">MSSQL</a> <a href="/list.php?id=10">AJAX</a> <a href="/list.php?id=8">.NET</a> <a href="/list.php?id=9">JSP</a> <a href="/list.php?id=14">Linux</a> <a href="/list.php?id=17">Mac</a> <a href="/list.php?id=7">ASP</a> <a href="/list.php?id=11">服务器</a> <a href="/list.php?id=15">SQL</a> <a href="/list.php?id=16">jQuery</a> <a href="/list.php?id=18">C#</a> <a href="/list.php?id=19">C++</a> <a href="/list.php?id=20">java</a> <a href="/list.php?id=21">Android</a> <a href="/list.php?id=22">IOS</a> <a href="/list.php?id=23">oracle</a> <a href="/list.php?id=24">MongoDB</a> <a href="/list.php?id=26">SQLite</a> <a href="http://wamp.phpstudy.net/">wamp</a> <a href="/jiaotong/">交通频道</a> <span style="display:none"> </span> </div> </div> <hr> </div><!--/.container--> <div class="bottom"> <div class="container"> Copyright © 2016 phpStudy | 豫ICP备2021030365号-3<script src="/images/foot.js?1"></script> </div> </div> <script src="/js/foot2.js"></script> <script src="http://cdn.bootcss.com/jquery/1.11.2/jquery.min.js"></script> <script src="http://cdn.bootcss.com/bootstrap/3.3.4/js/bootstrap.min.js"></script> </body> </html>