一、效果图:
tips:源码下载地址:https://files.cnblogs.com/waitingbar/sliderImgTxt.rar
二、源码show:
<script language="javascript" src="js/jquery1.4.js"></script>
<script language="javascript" src="js/sliderImgTxt.js"></script>
<script language="javascript">
$(document).ready(function(){
$("#sliderImgTxt").sliderImgTxt();
})
</script><!--start of sliderImgTxt-->
<div id="sliderImgTxt">
<div class="sImgTxtBar">
<!--start of sliderImgTxtBar-->
<div class="sliderImgTxtBar">
<div>
<div class="sliderImgTxtBarS">
<h2 class="sliderImgTxtTit">务人士数据图表</h2>
<p class="sliderImgTxtTxt">务人士数据图表PSD,商业,金融,商务,男人,女人,商务人士,数据,图表,柱状图,箭头,世界地图,蓝天白云,飞机</p>
<a class="sliderImgTxtImg" href="#"><img src="images/slideImgTxt1.jpg" /></a>
</div>
<div class="sliderImgTxtBarS">
<h2 class="sliderImgTxtTit">手拿地球商务</h2>
<p class="sliderImgTxtTxt">手拿地球商务psd素材,手拿地球,蓝色地球,商务,商务素材,城市,地图,箭头,手势,psd素材PSD格式,300DPI.</p>
<a class="sliderImgTxtImg" href="#"><img src="images/slideImgTxt2.jpg" /></a>
</div>
<div class="sliderImgTxtBarS">
<h2 class="sliderImgTxtTit">商务男人与笔记本</h2>
<p class="sliderImgTxtTxt">商务男人与笔记本psd素材,商务,男人,笔记本,职业人物,球,笔记本电脑,地图,商务素材</p>
<a class="sliderImgTxtImg" href="#"><img src="images/slideImgTxt3.jpg" /></a>
</div>
</div>
</div>
<!--end of sliderImgTxtBar-->
<!--start of numShwo-->
<div class="sNumBar"></div>
<!--end of numShwo -->
</div>
</div>
<!--end of sliderImgTxt-->