早上的开发者,
我希望在我的移动优化网站的顶部创建一个固定菜单,用户可以点按并向下拖动以显示网站菜单。
我发现的以下链接几乎就是我正在寻找的但不适用于触摸屏设备:
我想使用touchSwipe插件执行一个运行代码的函数,但我不知道该怎么做。
这是我到目前为止编写的代码。
它使用jQuery,jQuery UI和touchSwipe
// TOUCH SWIPE PLUGIN
$("#menuContainer").swipe({
swipeDown: function() { showMenu(); },
swipeUp: function() { showMenu(); },
tap: function() { showMenu(); },
threshold:20,
fingers:1
});
var openHeight = $("#menuContainer").outerHeight();
var openIHeight = $("#menuContainer").height();
$("#menuContainer").css('height','0px');
var closeHeight = $("#menuContainer").outerHeight();
var tippingPoint = openIHeight/2;
$("#ddMenu").css('visibility','hidden');
function showMenu() {
$("#menuContainer").resizable(
{
handles: {
"s":"#grippie"
},
maxHeight: openIHeight,
minHeight:0,
start: function(){
$("#ddMenu").css('visibility','visible');
},
stop: endDrag
}
);
function endDrag(){
if ($("#menuContainer").height() > tippingPoint){
$("#menuContainer").animate({ height:openIHeight }, 500);
}
else{
$("#menuContainer").animate({ height:0 }, 500, function(){
$("#ddMenu").css('visibility','hidden');
});
}
}
}
但这不起作用
请告知
此致 沙恩