zeyuan_index.html 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135
  1. <extend name="Public:pinduoduobase" />
  2. <block name="content">
  3. <link rel="stylesheet" href="__PUBLIC__/pinduoduo/assets/css/free_trial_page.css">
  4. <div id="main">
  5. <?php if(!empty($subject['banner'])){ ?>
  6. <div class="subject-banner" >
  7. <img src="/Uploads/image/{$subject.banner}" width="100%" />
  8. </div>
  9. <?php } ?>
  10. <div id="free-trial" class="container no-footer">
  11. <div id="free-trial-list">
  12. <div class="base-list-wrapper" id="tuan_list">
  13. <volist name="list" id="d">
  14. <div class="free-trial-list-item-0" onclick="location.href='{:U('/goods/'.$d['goods_id'])}'">
  15. <div class="free-trial-item">
  16. <div class="goods-img">
  17. <img src="{$fan_ly_image}" class="scrollLoading" data-echo="__UPLOAD__/{$d.image}" />
  18. </div>
  19. <p class="goods-name">{$d.name}</p>
  20. <div class="group-detail">
  21. <b class="price">
  22. ¥{$d.pinprice}
  23. </b>
  24. <del class="market-price">
  25. ¥{$d.price}
  26. </del>
  27. <a class="quantity">
  28. 限量 {$d.seller_count} 件
  29. </a>
  30. <!--ms-if-->
  31. <div class="status">申请试用</div>
  32. <div class="group-desc">
  33. {$d.pin_count}人团
  34. </div>
  35. </div>
  36. </div>
  37. </div>
  38. </volist>
  39. </div>
  40. </div>
  41. </div>
  42. </div>
  43. <div class="center" id="center_pullup" style="display:none;">
  44. <span><img class="img_rotate" src="__PUBLIC__/pinduoduo/assets/img/pull_loading_8eba142.png"/>
  45. </span><span class="orders_text"></span>
  46. </div>
  47. <include file="Widget:pin_notify" />
  48. <include file="Public:foot_lazy" />
  49. <style>
  50. .center {
  51. width: 170px;
  52. margin: 0 auto;
  53. text-align: center;
  54. }
  55. .img_rotate {
  56. width: 30px;
  57. height: 30px;
  58. margin-top: 7px;
  59. margin-right: 5px;
  60. -webkit-animation: loading 1s linear 0s infinite;
  61. }
  62. @-webkit-keyframes loading {
  63. 0% {
  64. -webkit-transform: rotate(0);
  65. }
  66. 100% {
  67. -webkit-transform: rotate(360deg);
  68. }
  69. }
  70. .orders_text {
  71. line-height: 45px;
  72. font-weight: 700;
  73. font-size: 15px;
  74. }
  75. </style>
  76. <script>
  77. var offset = 0;
  78. var _pa = 2;
  79. var is_can_next = 1;
  80. var cur_url = "{:U('Subject/index',array('id' => $subject_id))}";
  81. var req_step = 1;
  82. function loaddata()
  83. {
  84. var totalheight = parseFloat($(window).height()) + parseFloat($(window).scrollTop()); //浏览器的高度加上滚动条的高度
  85. if ($(document).height() <= totalheight+200) //当文档的高度小于或者等于总的高度的时候,开始动态加载数据
  86. {
  87. if(is_can_next == 1)//加载数据
  88. {
  89. is_can_next = 0;
  90. nextpage();
  91. }
  92. }
  93. }
  94. function nextpage()
  95. {
  96. $('#center_pullup').show();
  97. $.ajax(
  98. {
  99. url: cur_url,
  100. type:'post',
  101. data:{page:_pa},
  102. dataType: 'json',
  103. success: function(result){
  104. if(result.code == 1)
  105. {
  106. $('#tuan_list').append(result.html);
  107. $('#center_pullup').hide();
  108. _pa++;
  109. is_can_next = 1;
  110. bindImgEvent();
  111. } else if(result.code == 0) {
  112. $('#center_pullup').remove();
  113. }
  114. }
  115. }
  116. );
  117. }
  118. $(function(){
  119. $(window).scroll( function() {
  120. loaddata();
  121. });
  122. })
  123. </script>
  124. </block>