<!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"?/>
<meta?name="keywords"?content="JS代碼,焦點圖,JS廣告代碼,JS特效代碼"?/>
<meta?name="description"?content="此代碼內容為帶動畫效果的Devrama?slider焦點圖代碼,屬于站長常用代碼,更多焦點圖代碼請訪問懶人圖庫JS代碼頻道。"?/>
<title>帶動畫效果的Devrama?slider焦點圖代碼_懶人圖庫</title>
<link?rel="stylesheet"?href="css/lrtk.css">
<script?type="text/javascript"?src="js/jquery.min.js"></script>
<script?type="text/javascript"?src="js/jquery.devrama.slider.js"></script>
<style?type="text/css">
.example-animation?{
color:?#FFF;
font-size:?60px;
}
</style>
</head>
<body>
<!--?代碼?開始?-->
<div?class="example-animation">
<div?data-lazy-background="images/1.jpg">
<h3?data-pos="['0%',?'110%',?'0%',?'5%']"?data-duration="700"?data-effect="move">
Moving
</h3>
<div?data-pos="['-30%',?'25%',?'40%',?'25%']"?data-duration="700"?data-effect="move">
Text
</div>
<div?data-pos="['56%',?'-40%',?'56%',?'11%']"?data-duration="700"?data-effect="move">
and?Image
</div>
<div?data-pos="['23%',?'110%',?'23%',?'42%']"?data-duration="700"?data-effect="move">
<img?data-lazy-src="images/add.jpg"/>
</div>
</div> ?
</div>
<script?type="text/javascript">
$(document).ready(function(){
$('.example-animation').DrSlider();?//Yes!?that's?it!
});
</script>
<!--?代碼?結束?-->
<div?style="text-align:center;margin:50px?0">
<p>來源:<a?>wordpress?Xcoder</a></p>
<p>*尊重他人勞動成果,轉載請自覺注明出處!注:此代碼僅供學習交流,請勿用于商業用途。</p>
<p></p>
<p><p>帶動畫效果的Devrama?slider焦點圖代碼,可以在焦點圖中嵌入html內容和文字動畫效果,兼容主流瀏覽器,懶人圖庫推薦下載!</p><p><br?/></p><p>使用方法:</p><p>1、head區域引用文件lrtk.css及jquery.min.js,?jquery.devrama.slider.js</p><p>2、在文件中加入<!--?代碼?開始?--><!--?代碼?結束?-->區域代碼</p><p>3、復制images文件夾里的圖片到相應的路徑</p></p>
<p?style="margin:20px?0"></p>
</div>
</body>
</html>如紅色部分,我自己引用時如下圖為什么這種原因
關于jquery.devrama.slider插件的問題
淺水了
2015-08-04 00:36:45