动态移动滑动内容

时间:2013-10-03 21:25:58

标签: html css jquery-mobile dynamic swipe

大家好,我正在设计一个移动网站,而且我对移动jQuery缺乏经验,所以如果你们都能够帮助我的话。如果我可以在刷卡时刷新页面的一部分。此div包含产品目录代码,以便在刷新页面时产品发生更改。我希望能够做的是在我的页面中有一个特定的div标签,以便在进行滑动动作时刷新。

<div data-role="content" id="colorme">

<!-- Start:Here is where the product come up-->
<!--START: ITEM_TEMPLATE_0-->
<div style="padding: 1em .5em 1.5em .5em; text-align:center;" id="bg" >
    <div style="background-color:#ffffff; margin-bottom: .5em;"> <a href="product.asp?itemid=[catalogid]"><img src= "/thumbnail.asp?file=[THUMBNAIL]&maxx=200&maxy=0" width="200" alt="[name]" border="0"></a>
    </div>
    <div style="padding-bottom:.5em;" class="name"> [name]
    </div>
    <div>
    <a href="product.asp?itemid=[catalogid]"><img src="images/btn-more-details.png"></a>
    </div>
</div>
<!--END: ITEM_TEMPLATE_0-->
<!-- END: stop products-->

  </div>

  <div data-role="footer">
    <h1>My Footer</h1>
  </div>
</div> 

非常感谢!

抱歉,您可以在此处查看网站:

kitchenova.com/mobile

1 个答案:

答案 0 :(得分:0)

如果您使用的是jQuery Mobile库,则可以使用swipe()

http://api.jquerymobile.com/swipe/

这是一个事件监听器,它将检测“滑动”事件(我使用引号,因为它在技术上听取了点击和拖动,而不是原生触摸事件)

你可以放置你需要的任何功能,以完成你正在尝试的任何事情。

如果您只需要将新内容带入div,您还可以使用各种不同的插件实现类似滑动旋转木马的功能(其中许多插件实际上会使用真正的触摸事件,这可能很棘手自己做,但比jQuery的滑动方法更好,更顺畅)

我建议使用swipejs:

http://swipejs.com