上滑隐藏Panel的top部分如何实现？

ufo1982ufo

1.         Model.prototype.scrollViewPullDown = function(event) {
   
2.                 /*
   
3.                  * 1、滚动视图下拉事件 2、刷新data
   
4.                  */
   
5.                 this.comp("imgData").refreshData();
   
6.         };
   

复制代码

在淘宝中有一段代码是下拉刷新的。这个只有在顶部下拉时可以，如果我希望在用户上滑页面时隐藏panel的top部分要如何处理！

liangyongfei

1.panel组件组合使用！
比如， .在外层套用一个没有top的的panel ， 然后中间放置scrollView ，scrollView中再放置一个panel组件！只有top和content  在content中放置主要内容！
这样 scrollView 滚动的时候！看上去就是top也在滚动！

2.scrollView 的滚动事件中，js动态跳转top的高度！类似于/UI2/demo/tuniu/index_main.w 的onLoad 事件

ufo1982ufo

liangyongfei 发表于 2017-3-1 13:32
1.panel组件组合使用！
比如， .在外层套用一个没有top的的panel ， 然后中间放置scrollView ，scrollView ...

1.panel的这个办法，只能随着内容滚动了，我希望用户一直上滑时就动画一样的隐藏头部和下面的buttonGroup，当用户希望使用时，只需要下滑一下，头部和底部的buttongroup都又动画一样的出现。就是这样周而复始。
2.我看了代码是这样的：

1.         //页面初始化
   
2.         Model.prototype.modelLoad = function(event){
   
3.                 //页面下拉时页头显示背景颜色
   
4.                 var _this=this;
   
5.                 $(this.comp("homeContent").domNode).scroll(function() {
   
6.                         if($(this).scrollTop()>100){                       
   
7.                                 $(".x-titlebar", _this.getRootNode()).css({"background-color":"rgba(0,0,0,0.8)"});
   
8.                         } else {
   
9.                                 $(".x-titlebar", _this.getRootNode()).css({"background-color":"rgba(0,0,0,0)"});
   
10.                         }
    
11.                 });
    
12.         };
    

复制代码

这个应该是修改那个背景色的啊？就是透明的那个效果！

liangyongfei

ufo1982ufo 发表于 2017-3-1 15:12
1.panel的这个办法，只能随着内容滚动了，我希望用户一直上滑时就动画一样的隐藏头部和下面的buttonGroup ...

对的！你参考它的实现！动态修改top的高度！或者给他设置css样式！动画效果！

ufo1982ufo

liangyongfei 发表于 2017-3-1 15:57
对的！你参考它的实现！动态修改top的高度！或者给他设置css样式！动画效果！
...

我试着使用了JQuery的slideToggle()对panel的top进行操作，可以上滑top了，可是有一个白条还在top位置，是什么原因？

liangyongfei

ufo1982ufo 发表于 2017-3-2 10:46
我试着使用了JQuery的slideToggle()对panel的top进行操作，可以上滑top了，可是有一个白条还在top位置， ...

因为是局对布局！下面的位置不会自动上移！也需要你使用代码提高下面的位置！