示例代码下载
<!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=utf-8" /> <title>Web开发网--图片无间隙滚动</title> <meta name="Keywords" content="图片无间隙滚动"/> <meta name="Description" content="图片无间隙滚动"/> <mce:style type="text/css"><!-- body{font-size:12px;} #wapper{margin:100px auto;width:600px;border:solid 1px black;padding:20px;} .design{width:100%;padding:5px 0px 5px 0px;overflow:hidden;} .design a{color:#97450f;display:block;margin-top:5px;} .design li{width:245px;border:solid 1px #949494;height:125px;float:left;text-align:center;margin-left:5px !important;margin-right:5px !important;margin-left:4px;margin-right:4px;} .design li a.word{margin-top:0px;background:none no-repeat center center;width:100%;border-bottom:solid 1px #949494;height:100px;} --></mce:style><style type="text/css" mce_bogus="1"> body{font-size:12px;} #wapper{margin:100px auto;width:600px;border:solid 1px black;padding:20px;} .design{width:100%;padding:5px 0px 5px 0px;overflow:hidden;} .design a{color:#97450f;display:block;margin-top:5px;} .design li{width:245px;border:solid 1px #949494;height:125px;float:left;text-align:center;margin-left:5px !important;margin-right:5px !important;margin-left:4px;margin-right:4px;} .design li a.word{margin-top:0px;background:none no-repeat center center;width:100%;border-bottom:solid 1px #949494;height:100px;} </style> </head> <body> <div id="wapper"> <div class="design" id="dvMarquee" οnmοuseοver="mStop()" οnmοuseοut="mStart(event)"> <ul id="ulDemo"> <li><a style="background-image:url(http://www.w3dev.cn/imgdesign/2009625160410102_s.jpg);" mce_style="background-image:url(http://www.w3dev.cn/imgdesign/2009625160410102_s.jpg);" class="word" href="http://www.w3dev.cn/designdetail55.html" mce_href="http://www.w3dev.cn/designdetail55.html"></a><a href="http://www.w3dev.cn/designdetail55.html" mce_href="http://www.w3dev.cn/designdetail55.html">的士车车身系列</a></li> <li><a style="background-image:url(http://www.w3dev.cn/imgdesign/2009625160326297_s.jpg);" mce_style="background-image:url(http://www.w3dev.cn/imgdesign/2009625160326297_s.jpg);" class="word" href="http://www.w3dev.cn/designdetail54.html" mce_href="http://www.w3dev.cn/designdetail54.html"></a><a href="http://www.w3dev.cn/designdetail54.html" mce_href="http://www.w3dev.cn/designdetail54.html">的士车车身系列</a></li> <li><a style="background-image:url(http://www.w3dev.cn/imgdesign/2009625160222613_s.jpg);" mce_style="background-image:url(http://www.w3dev.cn/imgdesign/2009625160222613_s.jpg);" class="word" href="http://www.w3dev.cn/designdetail53.html" mce_href="http://www.w3dev.cn/designdetail53.html"></a><a href="http://www.w3dev.cn/designdetail53.html" mce_href="http://www.w3dev.cn/designdetail53.html">的士车车身系列</a></li> <li><a style="background-image:url(http://www.w3dev.cn/imgdesign/2009625153717892_s.jpg);" mce_style="background-image:url(http://www.w3dev.cn/imgdesign/2009625153717892_s.jpg);" class="word" href="http://www.w3dev.cn/designdetail52.html" mce_href="http://www.w3dev.cn/designdetail52.html"></a><a href="http://www.w3dev.cn/designdetail52.html" mce_href="http://www.w3dev.cn/designdetail52.html">全友家私</a></li> <li><a style="background-image:url(http://www.w3dev.cn/imgdesign/2009625152659533_s.jpg);" mce_style="background-image:url(http://www.w3dev.cn/imgdesign/2009625152659533_s.jpg);" class="word" href="http://www.w3dev.cn/designdetail51.html" mce_href="http://www.w3dev.cn/designdetail51.html"></a><a href="http://www.w3dev.cn/designdetail51.html" mce_href="http://www.w3dev.cn/designdetail51.html">中国移动通信集团</a></li> <li><a style="background-image:url(http://www.w3dev.cn/imgdesign/2009625152609840_s.jpg);" mce_style="background-image:url(http://www.w3dev.cn/imgdesign/2009625152609840_s.jpg);" class="word" href="http://www.w3dev.cn/designdetail50.html" mce_href="http://www.w3dev.cn/designdetail50.html"></a><a href="http://www.w3dev.cn/designdetail50.html" mce_href="http://www.w3dev.cn/designdetail50.html">鸿矛药酒</a></li> </ul> </div></div> <mce:script type="text/javascript"><!-- var Showbo={author:'Showbo'}; //是否为ie浏览器 Showbo.IsIE=!!document.all; //ie浏览器版本 Showbo.IEVersion=(function(){ if(!Showbo.IsIE)return -1; try{ return parseFloat(/msie ([/d/.]+)/i.exec(navigator.userAgent)[1]); }catch(e){return -1;}})(); //按id获取对象 Showbo.$=function(Id,isFrame){var o;if("string"==typeof(Id))o= document.getElementById(Id);else if("object"==typeof(Id))o= Id;else return null;return isFrame?(Showbo.IsIE?frames[Id]:o.contentWindow):o;} //按标签名称获取对象 Showbo.$s=function(){var o,tag;if(arguments.length==1){o=document;tag=arguments[0];}else{o=arguments[0];tag=arguments[1];}return o.getElementsByTagName(tag);} var dvMarquee=Showbo.$('dvMarquee'),ulDemo=Showbo.$('ulDemo'),lis=Showbo.$s(ulDemo,'li'),demoWidth=0,mTimer=null,mDelay=50,mScrollLeft=0; function mScroll(){ mScrollLeft++; dvMarquee.scrollLeft=mScrollLeft; if(mScrollLeft==demoWidth)mScrollLeft=Showbo.IsIE&&Showbo.IEVersion<7?3:2;//这里也要修改ie6的问题，设置为3/2比较流畅，如果设置为0会顿一下 } function mStop(){if(mTimer){clearInterval(mTimer);marqueeTimer=null;}} function mStart(e){ if("object"==typeof(e)){ var refO=e.toElement||e.relatedTarget; if(refO&&!dvMarquee.contains(refO))mTimer=setInterval('mScroll()',mDelay); } else mTimer=setInterval('mScroll()',mDelay); } if(lis.length>=3){//大于2张图片时执行滚动 demoWidth=(Showbo.IsIE&&Showbo.IEVersion<7?256:257)*lis.length;//注意ie6和ie7+及firefox的框架模型不一致，这里要修正大小 ulDemo.style.width=demoWidth*2+'px'; ulDemo.innerHTML+=ulDemo.innerHTML; mStart(true); } // --></mce:script> </body> </html>
本文来自http://www.w3dev.cn/article/20130101/294.aspx
· 前言 · 在國內，公網服務器與本地服務器的通信一直是個難題，本地服務器因爲IP是動態變化的，公網服務器沒辦法將請求發送給本地服務器。爲了解決這個問題，所以採用WebSocket協議替換Http協議。爲了實現請求等待，使用Gu
在這裏分享一下通過拖取 DataCube 代碼審計後發現的一些漏洞，包括前臺的文件上傳，信息泄露出賬號密碼，後臺的文件上傳。當然還有部分 SQL 注入漏洞，因爲 DataCube 採用的是 SQLite 的數據庫，所以SQL 注入相對來說顯
轉載自劉茫茫看山 問題背景 某天我們的租戶反饋數據庫連接缺少必要的驅動，我們通過日誌查看確實是缺少部分數據庫的驅動，因爲DolphinScheduler默認只帶了Oracle和MySQL的驅動，並且需要將pom文件中的test模式去掉纔可以
鴻蒙原生應用再新丁！新華社 入局鴻蒙 來自 #HarmonyOS# 微博5月27日消息 #鴻蒙千帆起#新華社客戶端完成鴻蒙原生應用核心版本開發，將實現不同使用場景下更加智能、精準、及時的要聞推送，以及主流價值的全場景覆蓋和高效傳播！與此同
記一次攻防演練中幸運的從若依弱口令到後臺getshell的過程和分析。 0x01 漏洞發現 首先，我會先把目標的二級域名拿去使用搜索引擎來搜索收集到包含這個目標二級域名的三級域名或者四級域名的網站。 這樣子可以快速的定位到你所要測試的漏洞
通過類之間的關係圖,讀懂spring boot原理 RequestBodyAdvice接口用於對Controller方法接收的請求體進行全局處理，可以在請求體被讀取之前或之後對請求體進行修改、包裝或添加一些額外的處理邏輯。下面是Req
鴻蒙原生應用再新丁！學習強國 入局鴻蒙 來自 #HarmonyOS# 微博5月23日消息 中央宣傳部宣傳輿情研究中心宣佈，將基於HarmonyOS NEXT鴻蒙星河版啓動“學習強國”App鴻蒙原生應用開發！“學習強國”App將爲鴻蒙生態帶
前言 在無線網絡技術不斷髮展的今天，Wi-Fi已經成爲了我們日常生活中不可或缺的一部分。無論是家庭娛樂、辦公還是在線遊戲，Wi-Fi都在提供着便捷的互聯網接入服務。然而，在安卓8.1後，爲了進一步延長安卓設備的待機時間。原生安卓(AO
鴻蒙原生應用再新丁！芒果TV 入局鴻蒙 來自 #HarmonyOS# 微博5月21日消息 深受年輕人喜愛的@芒果TV 宣佈完成鴻蒙原生應用Beta版開發🎉芒果TV獨家精品內容結合HarmonyOS NEXT創新能力，將爲用戶帶來更加便捷
我們已經學習了很多自動化的知識了，接下來讓我們看看在blog-auto-publishing-tools中是如何實現自動發送博文到知乎的。 前提條件 前提條件當然是先下載 blog-auto-publishing-tools這個博客自動發佈
雖然頭條現在非常強大，但是我還是不得不吐槽一下頭條的博客發佈，居然不支持markdown格式。 並且在某些瀏覽器上還會出現編輯頁面打不開的情況，讓我一度懷疑是我瀏覽器的問題。 不過，這都不重要，重要的是blog-auto-publishin
一、背景 上週小組有個需求上線牽扯9個應用（小組目前維護了26個服務，由於團隊系統業務屬性特徵基於高可用、高性能原則拆分，有些是合理的，有些不是很合理的），同時上週OpsReview的一個微服務濫用典範案例（Promise服務A調用服務B，
一、重構背景 1.1、退款 京東秒送秒送退款有2套結構，代碼邏輯混亂； 其中秒送、天選部分售後單是和平生pop交互退款，部分是和售後中臺交互退款；並且兼容3套邏輯； 痛點：代碼繁重，缺乏合理性的設計，後續迭代開發以及維護成本高，同時增加
自動裝配原理分析 條件註冊機制 spring-context模塊中有兩個組件：Condition接口和@Conditional註解，在@Conditional註解中可以指定一組Condition實現， 通常@Conditional是和@Co
前端面試題 - vue的雙向綁定原理是什麼？ vue2的雙向數據綁定是通過數據劫持結合發佈者訂閱者模式的方式來實現。 通過object.defineProperty來劫持各個屬性的setter，getter，在數據變化時發佈消息給訂閱者，
