江湖家居至尊版手机版装修效果图TouchSlide 触屏滑动特效...
江湖家居V6.0至尊版官方演示站，手机版首页中部装修效果图，使用了 TouchSlide 触屏滑动特效插件，TouchSlide 是纯javascript打造的触屏滑动特效插件，面向手机、平板电脑等移动终端，能实现触屏焦点图、触屏Tab切换、触屏多图切换等常用效果。以下是江湖家居手机版模板首页中的HTMl结构，分别是 ".hd" 里面包含ul， ".bd" 里面包含ul，在 /themes/default/mobile/index.html 模板中相关代码如下：
<!--装修效果图开始-->
<div id="effectImg" class="mb10">
<div class="tabBox">
<div class="indexTitle">
<h1 class="fl">装修效果图</h1>
<div class="hd fr">
<ul>
<li class="on"><a href="###">风格</a></li>
<li class=""><a href="###">空间</a></li>
<li class=""><a href="###">别墅</a></li>
<li class=""><a href="###">小户型</a></li>
</ul>
</div>
<div class="clear"></div>
</div>
<div class="bd">
<div class="list_box">
<div class="imgList"> <{KT id="4" name="网站首页4F热门案例-风格" city_id=$request.city_id limit="3"}> <a class="img_box" href="<{link ctl='mobile/case:detail' arg0=$item.case_id}>"><img src="<{$pager.img}>/<{$item.thumb}>" /></a> <{/KT}> </div>
<a href="<{link ctl='mobile/case'}>" class="more pointcl">查看更多风格</a> </div>
<div class="list_box">
<div class="imgList"> <{KT id="5" name="网站首页4F热门案例-空间" city_id=$request.city_id limit="3"}> <a class="img_box" href="<{link ctl='mobile/case:detail' arg0=$item.case_id}>"><img src="<{$pager.img}>/<{$item.thumb}>" /></a> <{/KT}> </div>
<a href="<{link ctl='mobile/case'}>" class="more pointcl">查看更多空间</a> </div>
<div class="list_box">
<div class="imgList"> <{KT id="6" name="网站首页4F热门案例-别墅" city_id=$request.city_id limit="3"}> <a class="img_box" href="<{link ctl='mobile/case:detail'arg0=$item.case_id}>"><img src="<{$pager.img}>/<{$item.thumb}>" /></a> <{/KT}> </div>
<a href="<{link ctl='mobile/case'}>" class="more pointcl">查看更多别墅</a> </div>
<div class="list_box">
<div class="imgList"> <{KT id="7" name="网站首页4F热门案例-小户型" city_id=$request.city_id limit="3"}> <a class="img_box" href="<{link ctl='mobile/case:detail'arg0=$item.case_id}>"><img src="<{$pager.img}>/<{$item.thumb}>" /></a> <{/KT}> </div>
<a href="<{link ctl='mobile/case'}>" class="more pointcl">查看更多小户型</a> </div>
</div>
</div>
</div>
<!--装修效果图结束-->
相关使用教程：
如何使用-TouchSlide 触屏滑动特效插件
http://www.superslide2.com/TouchSlide/howToUse.html
TouchSlide 触屏滑动特效插件http://www.twbweb.com/1262.html
页:
[1]