- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我网站的移动网站 ( http://www.codesrce.com/thedrumcenter ) 有一个非常现代和实用的推送菜单。但是,我希望使其更加用户友好。有人可以帮我调整我的代码,这样当用户按下菜单按钮时,菜单就会打开,并且当用户向右滑动屏幕打开它,然后一旦打开,他们就会向左滑动到关闭它?另外,当按下按钮时,我希望它变成这种颜色,#0099FF,然后当它关闭时变回灰色。对不起,如果我的措辞不是最好的,但我希望你明白我的意思。 :) 到目前为止,我将提供我的代码:
HTML
<div id="Mobile">
<div id="menu">
<ul>
<li><a href="#">Top Brands</a></li>
<li><a href="#">Drums</a></li>
<li><a href="#">Hardware</a></li>
<li><a href="#">Cymbals</a></li>
<li><a href="#">Sticks</a></li>
<li><a href="#">Drum Heads</a></li>
<li><a href="#">Terms of Use</a></li>
<li><a href="#">Affiliations</a></li>
</ul>
</div>
<div id="right">
<div id="Top">
<div id="menubar">
<a id="menubarheader">DrumCenter</a>
<a href="#menu" id="button" class="buttonicon"></a>
<a href="#" id="searchlink" class="searchlink"></a>
</div>
</div>
</div>
</div>
JQuery
$('#button').toggle(
function() {
$('#right').animate({ left: 275}, 'fast', function() {
$('#button');
});
},
function() {
$('#right').animate({ left: 0 }, 'fast', function() {
$('#button');
});
}
);
任何帮助将不胜感激,因为我是 Javascript 和 JQuery 的完全 NOOB。谢谢!
最佳答案
基本上有不同的方法来解决这个问题。我检查了您网站上的 CSS 以了解您是如何做的,但是我放弃了 8 个 CSS...在浏览器中看太多了。
所以..基本上我认为这个问题是在 Swipe in the middle to open panel with jQuery Mobile? 他给了一个 fiddle 这样的 http://fiddle.jshell.net/Palestinian/2B4Ht/
所以我会以某种方式将其实现到您的编码中。有一个顶部固定的导航栏,当它折叠时会显示你的“推送菜单”。如果屏幕宽度小于 768 像素或您可以向左或向右滑动以打开将成为菜单本身的面板,则只需选择选项即可。
只是我的建议。我从来没有做过像你要求的那样的菜单,但我认为这不会很难。
关于javascript - 如何使我的推送菜单更加人性化?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24353564/
这是我目前正在使用的一个技巧: class ProductMaxIPPortEldCountMonthlyTable(tables.Table): i
我是一名优秀的程序员,十分优秀!