微信小程序,导航链在向上滑动是被隐藏到轮播图下面之后,整个页面才也正常向上滚动隐藏。

![图片说明](https://img-ask.csdn.net/upload/201709/29/1506652748_769611.png)图片说明![图片说明](https://img-ask.csdn.net/upload/201709/29/1506652760_505825.png)

0

5个回答

图片说明

0

图片说明

0

样式表和 实际效果图都已上传。麻烦各位帮我看看。万分感谢!!!

0

看一下.weui-tab_panel的样式

0

.weui-tab__panel {
height:100%;
padding-top:50px;
overflow:auto;
-webkit-overflow-scrolling:touch;
}
这个公共样式

padding-top:0;

0
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
其他相关推荐
向下滚动隐藏导航栏,向上滚动显示
Document body{ margin:0; padding: 0; height: 3000px; } #fix_nav{background-color: #ccc;} .nav{width:980px; margin:0 auto;} .nav li{display:inline-block; *display:inline; *zoom:1; margin:0 10
小程序滑动临界值固定隐藏显示导航栏
wx.createSelectorQuery().select('#the-id').boundingClientRect(function(rect){ rect.id // 节点的ID rect.dataset // 节点的dataset rect.left // 节点的左边界坐标 rect.right // 节点的右边界坐...
微信小程序-隐藏和显示自定义的导航
微信小程序中不能直接操作window对象,document文档,跟html的树结构不相同。 点击网络显示或隐藏网络中包含的内容。其他类似。 如果是jquery很方便实现,能直接操作document。在微信小程序中实现思路是:在逻辑层定义变量,通过setData赋值。 方法一:通过变量直接赋值,给每一个要控制显示的view定义变量 .wxml 代码: 视图容器 view m...
实现向上滚动隐藏导航栏,向下滚动显示导航栏
效果图 2.gif 代码实现 @interface ViewController ()<UIScrollViewDelegate> @property (nonatomic,strong) UIScrollView* scrollView; @end @implementation ViewController - (voi...
【微信小程序】 隐藏小程序 导航栏/TabBar
1、页面不存在于app.json中的 tabBar.list 2、使用wx.navigateTo 跳转到新页面 3、 微信基础库1.9.0开始支持api wx.hideTabBar/wx.showTabBar wx.hideTabBar({ animation:true //是否需要过渡动画 }) wx.showTabBar({ animation:true //是否需要...
IOS开发 - UIScrollView如何实现向上滚动让某个控件逐渐消失or导航条消失
下面我们来看一下UIScrollView当向上滑动式如何让它上面的某个控件逐渐消失我们先来看一下效果图其实实现这个功能很简单 , 我们只需要使用UIScrollView的代理方法就可以让我们的类遵守<UIScrollViewDelegate> ,然后复制如下一段代码:- (void)scrollViewDidScroll:(UIScrollView*)scrollView{    CG...
web-view组件的可行性使用以及小程序的导航栏设置
1.近日随着小程序游戏”跳一跳”横空出世,微信小程序火爆一时。随之而来的是各类APP/服务号/网页的翻版小程序,开始入驻人们的日常生活中。那么微信小程序到底有什么不同之处呢,本文将针对前端工作者的可行性利弊来说。 2.首先微信小程序除了文件命名不同于html/css外,以及view标签的使用,还有数值编程不同,大体来说前端还是能够hold的住的 3.在微信小程序里面可以设置app.json数据
iOS开发上下滑动UIScrollview隐藏或者显示导航栏的实例
一、好多App都有上下滑动UIScrollview隐藏或者显示导航栏,在这里我说说我觉得有用的几种方法: 1.iOS8之后系统有一个属性hidesBarsOnSwipe Objective-C代码如下 ? 1 self.navigationController.hidesBarsOnSwipe = YES; swift代码如下 ? 1 ...
鼠标滚轮向上出现header导航,滚轮向下隐藏header
找了个简单的实现,之前是看yahoo这么做的,觉得很不错,用户体验好一点 var agent = navigator.userAgent; if (/.*Firefox.*/.test(agent)) { document.addEventListener("DOMMouseScroll", function(e) { e = e ||
Vue、JS判断滚动方向【Nav导航条根据滚动条方向显示淡入淡出效果。】
Vue、JS判断滚动方向【Nav导航条根据滚动条方向显示淡入淡出效果。】 核心内容就几行,ctrl+f 搜索 mounted 第三个就是。 在纯js跑请复制 mounted 块中的代码,并去掉this.show=flase/true; 在vue下跑,没用less的话请去掉lang="less" 然后自行找个在线less编译一下style块中的内容。 这个代码主要实现了:Nav导航条根据滚动条方向...
微信小程序隐藏标题栏navigationBar的方法
未隐藏前: 在app.json里面window选项里面设置一下: 最终显示效果: 这样就没有了标题栏
小程序swiper-item中banner有一部分被隐藏
可以直接给swiper组件添加高度 <swiper indicator-dots="true" autoplay="true" interval="3000" duration="500" style="height:320rpx"> <block wx:for="{{banner}}"> <swiper
Jquery笔记--滚动条移动,导航条显示隐藏和响应式。
相信有很多人在写前端特效的时候时候会遇到滚动条监测导航的问题,也就是当页面被拉动到某个位置的时候导航条显示出现。到顶部的时候导航条又是另一种效果方式呈现,那时候我研究了这个问题大概花了几天 的时间,后来把他实现出来了。   然后为了简洁操作我把它封装成了Jquery的第三方扩展包。并添加上了类似于现在的响应式,因为是使用JS侦测的。相比于css3的media属性来说,兼容性相对较好。  这里面解决
App之上下滑动UIScrollview隐藏或者显示导航栏
iOS版:一、好多App都有上下滑动UIScrollview隐藏或者显示导航栏,在这里我说说我觉得有用的几种方法:1.iOS8之后系统有一个属性hidesBarsOnSwipe Objective-C代码如下[objc] view plain copyself.navigationController.hidesBarsOnSwipe = YES;   swift代码如下[objc] view p...
微信小程序:<view>视图的切换显示\隐藏详解(假的两个页面,实际上是通过事件点击进行<view>视图的隐藏和显示的切换)
假的两个页面,实际上是通过事件点击进行&amp;lt;view&amp;gt;视图的隐藏和显示的切换,不是两个WXML之间进行切换而是同一个WXML中有很多个不同的&amp;lt;view&amp;gt;, 比如同一个页面中有&quot;关注&quot;和&quot;发现&quot;,   点击&quot;关注&quot;时 ,   &quot;关注&quot;页面显示,   &quot;发现&quot;的页面隐藏,;  点击&quot;发现&quot;时 , &quot;关注&quot;的页面隐藏.  
小程序点击轮播图跳转到tab导航界面
需求:小程序点击轮播图跳转到tab导航界面,效果如下所示 点击轮播图的图片,跳转到我的界面上 先实现以下的代码,在以下的基础上,开始实现需求 微信小程序底部导航栏 https://www.jianshu.com/p/89a63dc99839 微信小程序轮播图 https://www.jianshu.com/p/bc3261557031 ...
移动端控制上滑导航条消失,下滑出现
var p = 0, t = 0; //上下滚动时隐藏导航栏 $(window).scroll(function(e){ //下滑 p =$(this).scrollTop(); if(t &amp;lt; p &amp;amp;&amp;amp; p !==0){ $('.my-nav-footer').slideUp('fast'); ...
onPageScroll微信小程序底部悬浮框滑到底部隐藏,其他情况显示
onPageScroll 利用onpageScroll监测屏幕的位置 优点 1.有点操作简单粗暴。 缺点 2.缺点固定值不能确定的时候会有偏差。需要借助另一个 功能组件SelectorQuery 使用方法 onPageScroll:function(res){ console.log(res) if (res.scrollTop &lt; 600){ t...
微信开发隐藏网页右上角按钮与底部导航栏
Weixin JS接口Weixin JS接口是微信为你的H5应用提供开放原生能力的接口,你的应用可以利用这些接口使用更多的微信原生能力和微信的操控能力, 以使得你的应用有更强大的智能,更好的用户体验。除了以下章节所描述的各类接口。拍照、上传图片、扫码、微信支付、地理位置上报等更多的接口已经或正在抓紧开放中,更多信息也请参考微信相关网站了解.隐藏微信中网页右上角按钮企业号在有需要时(如不需要用户分享...
页面向下滑动实现div显示和隐藏
Title heheh $(document).ready(function(){ var min_height = 100; $(window).scroll(function(){ var s =$(window).scrollTop(); if(s > min_height){ $("#div").show() }else{ $("#div").hi
微信小程序实现slideUp、slideDown滑动效果及点击空白隐藏功能示例
本文实例讲述了微信小程序实现slideUp、slideDown滑动效果及点击空白隐藏功能。分享给大家供大家参考,具体如下: 怎样实现jq中的slideUp或者slideDown这种动画效果呢,我的思路是用css3的transform: translateY() 属性,给需要动画的元素添加上一个动画class。 1.蒙层的结构: `&amp;lt;!-- 购物车蒙层 --&amp;gt;` `&amp;lt;``view`...
微信小程序之显示隐藏
wxml文件 &amp;amp;lt;view class='head_span' wx:if=&amp;quot;{{head_span}}&amp;quot; bindtap='search_cancel'&amp;amp;gt; &amp;amp;lt;span&amp;amp;gt;取消&amp;amp;lt;/span&amp;amp;gt; &amp;amp;lt;/view&amp;amp;gt;
微信小程序使用JS隐藏view,结合css语法处理
开始写技术博客,当做一个积累,也是思路的沉淀,也希望可以帮助到同行的小伙伴! 首先可以看下这篇文章, http://blog.csdn.net/u010802056/article/details/54580666 我是参考这个,但是没有解决了,然后瞎想,就解决了 大概分3不: 1、定义变量、需要在前端xml中使用 Page({ data: { conf
微信小程序之底部导航栏——tabBar
微信的开发文档里有,很多人也写了,自己写一遍,加深印象罢! 在学习Android的时候,被模仿一个app的界面,实现其UI。而一般来说,总是避免不了导航栏的。 比较大众化的,就是底部导航栏啦,而实现的方式也是非常的多,如:Fragment+ViewPage Or 来一个RadioGroup Or 以前的TabHost 等~ 效果,是一样或差不多的,而实现手法,是五花八门特色鲜明的! 在
微信小程序的加载状态添加和隐藏
使用下面代码添加 wx.showToast({ title:'加载中', icon:'loading', mask:true }) 然后我们调用下面方法进行隐藏loading状态 wx.hideToast(); 这个主要用于加载数据,或者加载页面时候的显示,表明状态 ...
FloatingActionButton向下滑动隐藏向上滑动显示
beauty_recycle.addOnScrollListener(new RecyclerView.OnScrollListener() { @Override public void onScrolled(RecyclerView recyclerView, int dx, int dy) { super.onScrolled(recyclerView, d...
解决页面加载轮播图下面的内容抖动问题
页面开始加载时,如果网络慢,图片加载会很慢,这是它盒子的高度并没有所以下面的内容会上移,当你的图片加载出来以后,刚刚的内容会下移从而出现抖动问题解决:给图片的盒子加一个初始值,当图片加载出来时,超出部分再隐藏    overflow: hidden    width: 100%    height: 0    padding-bottom: 30% (图片的高度大概)...
iOS开发上下滑动UIScrollview隐藏或者显示导航栏
一、好多App都有上下滑动UIScrollview隐藏或者显示导航栏,在这里我说说我觉得有用的几种方法: 1.iOS8之后系统有一个属性hidesBarsOnSwipe  Objective-C代码如下 self.navigationController.hidesBarsOnSwipe = YES;  swift代码如下 self.navigationController?.hides
微信小程序隐藏tabBar
微信小程序隐藏tabBar1、在app.json中的list内不能有非tabBar页面。简单说就是这个页面不要tabBar,那么tabBar也不要他了。{ "pages":[ "pages/index/index", "pages/logs/logs", "pages/reg/reg" ], "window":{ "backgroundTextStyle"
小程序Canvas隐藏问题处理
一、目前版本小程序框架 当前问题参考处理建议使用这种方式:https://my.oschina.net/tianma3798/blog/2051575 canvas使用方面还有些不足地方。 比如:canvas 的直接隐藏目前不可用 display:none 只要使用上线文draw绘制就会显示在页面最上层,遮盖其他内容。 当前问题解决方案1: 在page的直接子节点添加一层view,将v...
Android CoordinatorLayout + AppBarLayout+ToolBar(向上滚动隐藏指定的View)
实现的效果: 向下滚动RecylerView,Tab会被隐藏,向上滚动RecylerView,Tab恢复出现.这么做的好处在于,用户能有更多的空间位置去看列表里面的内容.
仿知乎主页,上滑隐藏NavigationBar,下滑显示
最近在仿作知乎客户端,知乎首页的 navigationBar 会随着下方的 tableView 滑动而改变,上滑隐藏,下拉显示,并且下拉需要一定速度才会触发显示。在网上查了一下,看到一个随 TableView 滑动改变 NavigationBar 透明度的demo,虽然和自己的需求不一样,但提供了利用 KVO 实现的思路,有了思路就着手做了,调试了几次和知乎官方实现效果稍有不同,但基本需求实现了,
小程序TabBar栏的显示和隐藏
有的时候我们可能需要将底部的TabBar隐藏起来,比如弹出分享弹出框得时候就可设置隐藏。 十分简单,参考以下: // 显示 wx.showTabBar({}) // 隐藏 wx.hideTabBar({}) 以下是小程序对应的文档: https://developers.weixin.qq.com/miniprogram/dev/api/ui-tabbar.html#wxsett...
微信小程序:隐藏和显示功能
和界面 app.js Page({ data:{ showView:true }, onLoad:function(options){ // 生命周期函数--监听页面加载 showView:(options.showView=="true"?true:false) } ,onChangeShowState:function(){ va
小程序开发踩坑记录(四)——fixed元素在下拉刷新时会被遮挡且双端表现不一致问题(自制底部tabbar时会遇到的的bug)
①问题描述 微信小程序提供了官方的底部导航栏-tabbar,但项目中为满足设计要求、实现更好的效果,需要自己模拟底部导航栏。而在制作过程中就发现了问题。 自制底部导航栏的基本思路为:将自制导航元素在index页面底部使用 { display:fixed } 定位,其中的各个导航图标控制index内多个 component 的 wx:if 从而实现模拟的页面跳转(实际是在一个页面内的显示隐藏)。 如...
小程序内嵌H5页面自定义导航栏消失
背景:我们的QA找到我,说OPPO系的手机都会出现H5导航栏消失,我以为兼容性问题,各种找资料发现了坑 1.如下同样在小程序中嵌入H5对比图: 有导航栏 无导航栏 row 1 col image 2.为什么会出现这种情况呢? 小程序官方给出说法: 是因为微信的版本--要升级到6.7.2以上版本 Ennn........
微信小程序实现点击空白隐藏
怎样实现jq中的slideUp或者slideDown这种动画效果呢,我的思路是用css3的transform: translateY()属性,给需要动画的元素添加上一个动画class。 先上效果图: 1.蒙层的结构: &amp;lt;!-- 购物车蒙层 --&amp;gt; &amp;lt;view class='list-fix' wx:if=&quot;{{mengShow}}&quot; bindtap='outbtn'&amp;gt; ...
scrollIntoView实现h5聊天内容向上滚动
写一个毫不考虑样式的例子: &amp;lt;!DOCTYPE html&amp;gt; &amp;lt;html&amp;gt; &amp;lt;head&amp;gt; &amp;lt;title&amp;gt;chat&amp;lt;/title&amp;gt; &amp;lt;script src=&quot;./jquery-2.0.0.min.js&quot;&amp;gt;&amp;lt;/script&amp;gt; &amp;lt;/head&amp;gt; &amp;lt;style
小程序隐藏右侧滚动条
一开始,在固定高度的容器里面,会出现一个很难看的滚动条,要实现隐藏滚动条,还可以继续滚动的完美效果。 其实很简单,只需要在css文件里面加上这样的一段代码 /* 隐藏滚动条 */ ::-webkit-scrollbar{ width: 0; height: 0; color: transparent; } 完美实现: 原文作者:祈澈姑娘 技术博客:https://w...
微信小程序跳坑(一)-----BarTab没有显示
1,书写,正确书写时tabBar,不要写成tabbar,地球人都知道 2,当创建新工程时,app.json中Pages配置是这样的 ,,【图1】, 注意:微信小程序里面的json文件时不能注释的,图中只是给读者看一下该放在哪里而已,,,,不能注释!!! 3,在一些json文件中,如果是你没有写上的,就必须加上 {} 花括号。 4,在BarTab中的List属性,里面的index
文章热词 机器学习教程 Objective-C培训 交互设计视频教程 颜色模型 设计制作学习
相关热词 mysql关联查询两次本表 native底部 react extjs glyph 图标 小程序 开发教程 微信 微信小程序游戏开发教程