toggle手机菜单jQuery右推push效果

2014年10月1日00:32:12 4 3,502

又整顿了一下博客的手机端菜单样式,本来想换成如题的效果,但是一直没有整出来,不知道是神马问题,也许是因为我的主题布局吧,总之技术还不够,硬着头皮摸索了几下,发现实现不了,个人觉得js冲突,就放弃了,当然,简单的布局一下子就能实现,好吧,下面就分享一下方法。

点击这里看演示效果,代码也不用多说,例子里都有了。

在实现这个过程中,找了N个实现方法,有一种是用到mobile.css和mobile.js的类的,NND的套用上去主题就出乱子,css代码还是写个性一点好,这样就能套用了。

点这里查看演示效果,还是不多说,代码都在那里了。

不是专业,只能硬套,也没工夫去研究,头大,但是套用的话看过去也不是很难,可要是实现不来的话,就只能卡那里了,如果你的主题简单的话,实现起来还是挺容易的。

这菜单方式现在虽然挺潮,但个人感觉实用性并不大,美观性比较赞,这应该是我很早之前提过的手机app里面菜单设计

现在本站的菜单直接改成jQuery控制隐藏显示div层的方式,注意非hide(),而是直接用display.none或block方式,不太喜欢slide显示效果,对加载页面也慢。

没了,新手机菜单样式:(具体怎么样,可以体验一下)

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

目前评论:4   其中:访客  2   博主  2

    • 大发 4
      Firefox 32 Windows 7

      侧滑bug太多了

        • 郑永 Admin
          Google Chrome 37 Windows XP

          是啊,那正好可以不用考虑,呵呵。

          @大发

          • 郑永 Admin
            Google Chrome 37 Android 4.4.2

            这次还是用上了,欢迎评测bug

            @大发

          • 免费外链 1
            Firefox 32 Windows 7

            很漂亮