猿问

关于jquery.devrama.slider插件的问题

<!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 href="http://jquery-plugins.net/devrama-slider-jquery-image-html-slider-plugin" target="_blank">jquery-plugins.net</a> 代码整理:<a href="http://www.lanrentuku.com/" target="_blank">懒人图库</a> 感谢:<a href="http://blog.hexccc.com/service/" target="_blank">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、在文件中加入&lt;!-- 代码 开始 --&gt;&lt;!-- 代码 结束 --&gt;区域代码</p><p>3、复制images文件夹里的图片到相应的路径</p></p>
<p style="margin:20px 0"></p>
</div>
</body>
</html>

如红色部分,我自己引用时如下图

http://img.mukewang.com/55bf988100019df209240098.jpg

为什么这种原因

浅水了
浏览 2132回答 0
0回答
随时随地看视频慕课网APP
我要回答