page-scroll.js 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. // components/page-scroll/page-scroll.js
  2. Component({
  3. /**
  4. * 组件的属性列表
  5. */
  6. properties: {
  7. "className":{
  8. value:"",
  9. type:String
  10. },
  11. "styleSheet":{
  12. value:"",
  13. type:String
  14. },
  15. "upper-threshold":{
  16. value:5,
  17. type:Number
  18. }
  19. },
  20. /**
  21. * 组件的初始数据
  22. */
  23. data: {
  24. height:0,
  25. upper:true
  26. },
  27. ready:function(){
  28. },
  29. methods: {
  30. scrollLower:function(e){
  31. this.triggerEvent("scrolltolower",e.detail);
  32. },
  33. scrollUpper:function(e){
  34. this.triggerEvent("scrolltoupper",e.detail);
  35. },
  36. scroll:function(e){
  37. if(this.data.upper){
  38. if(e.detail.scrollTop>this.data["upper-threshold"]){
  39. this.setData({
  40. upper:false,
  41. height:0
  42. })
  43. }
  44. }else{
  45. if(e.detail.scrollTop<this.data["upper-threshold"]){
  46. this.setData({
  47. upper:true
  48. })
  49. }
  50. }
  51. this.triggerEvent("scroll",this.data.upper);
  52. },
  53. changeHeight:function(e){
  54. var _self=this;
  55. if(this.data.starttop){
  56. this.setData({
  57. height:(e.touches[0].pageY-this.data.starttop)/2
  58. })
  59. this.triggerEvent("topheight",this.data.height);
  60. }else{
  61. this.setData({
  62. starttop:e.touches[0].pageY
  63. })
  64. }
  65. },
  66. endChange:function(e){
  67. var obj = {
  68. starttop:0
  69. }
  70. if(this.data.height){
  71. obj.height=0;
  72. }
  73. this.setData(obj);
  74. this.triggerEvent("topheight",this.data.height);
  75. }
  76. }
  77. })