How do I unbind all events from SqueezeBox backdrop modal? I have tried
jQuery('#sbox-overlay').unbind('click')
but to no avail
try to do this in your onload block.
jQuery('#sbox-overlay').off()
regards
Related
Hello I'm trying to combine in a div the .sortable operation of jquery-ui with swipe evente on mobile device. Unfortunately when a div is .sortable it does not handle the 'swipe' event.
Any Ideas?
jQuery UI doesn't support touchevents at the moment. You could use a plugin which converts the mouseevents as touch events here is link to the Homepage and Github. Thats the only way i know how to make jQuery UI widges touchable.
I am creating a new jQuery UI dialog and then resizing it to a higher height.
When I click the close button (X), the dialog moves up to the top of the screen instead of closing itself.
This occurs only in Internet Explorer (IE9 in my case).
Any workarounds to this?
Here's the js fiddle reproducing this bug:
http://jsfiddle.net/5WJBR/1/
$(document).ready(function(){
$('#dialog').dialog();
$('#dialog').dialog('option','height', '1000');
});
I managed to make it work by removing the vertical scrollbar using css overflow-y:hidden but I in my use case I definitely need the vertical scrolling activated.
Thanks for any help,
Jimmy
Ok here's the fix for those interested (applies only for jQuery UI version 1.9.1 and below):
var that = this;
$('.ui-dialog-titlebar-close').on('mousedown', function({
that.dialog.dialog('destroy');
});
FYI, binding the titlebar on the 'click' event will not work!! Mousedown does.
Thanks,
-J
I'm trying to bind a tap event to no avail:
$('label[for=p_divisionR]').bind('tap', function(){
$('#propertyTypeDivision').parent().show();
$("#propertyType").parent().hide();
$("#propertyTypeDivisionRL").parent().hide();
hideBedrooms();
});
I have tried with .live('tap', fn) as well which doesn't work. However when on a desktop, using .live('click', fn) works fine.
Why would the click event work but not tap? It's being tested on an iPad using jQuery mobile rc1.
See:
http://m.bentons.propertylogic.net/
You can use other events like touchstart along with click. They respond to touch on safari in iOS. This approach worked for me.
$('#p_divisionR').live('click touchstart', function(){
$('#propertyTypeDivision').parent().show();
$("#propertyType").parent().hide();
$("#propertyTypeDivisionRL").parent().hide();
hideBedrooms();
});
Use vclick There were issues with tap back in the beta days and their developers recommended people use vclick. vclick will work on both mobile and desktop. Tap will sometimes trigger multiple events.
$('#p_divisionR').live('change', function(){
$('#propertyTypeDivision').parent().show();
$("#propertyType").parent().hide();
$("#propertyTypeDivisionRL").parent().hide();
hideBedrooms();
});
EDIT:
http://jsfiddle.net/jostster/UHX5k/1/
Forgot you were using radio buttons. For those you should use change instead of vclick
I have a serious problem in Safari on iPad. The new contenteditable features doesn't seem to work with touchmove event!
code:
...
<script>
function doNothing(event) { return; }
function initIFrame() {
var iframe=document.getElementById("iframeedit");
iframe.contentWindow.document.designMode="on";
iframe.contentWindow.document.addEventListener("touchmove", doNothing, true);
}
</script>
</head>
<body onload="initIFrame()">
<iframe style="width:500ppx;height:200px" src="content.html" id="iframeedit"></iframe>
...
By adding touchmove somewhere to the document the editable content can not be edited anymore after a touchmove (hold finger down to get the magnifier). The cursor can be set but typing by onscreen keyboard is not allowed anymore.
Test script (for iPad + iOS5):
http://flyingdog.biz/tests/ipad/test2.html
Another test script which is working:
http://flyingdog.biz/tests/ipad/test1.html
As you can see in that other script I put a few lines of text in front of iFrame - very strange! I am looking for another/better workaround or did I have done something wrong? Without the touchmove event it is working but I need this for a good editing experience.
I found a workaround for this bug: It seems that the iframe document looses the focus after a touch event, especially when the copy&paste menu appears. To workaround this bug add a keydown event handler to the iframe-document and reset the focus to the document:
var iframeDoc = $(iframe.contentWindow.document);
iframeDoc.keydown(function(event) {
iframe.contentWindow.focus();
});
This fixes the bug mostly for me. Only if the user types very fast (e.g. on a connected bluetooth keyboard) it can happen that some keystrokes are lost, because the javascript keydown handler execution is a little bit delayed on the iPad.
I am building an iOS app in webkit, so my whole UI is a webview. on touchStart of any element near the outer boundary of the webview (that does not have a touchStart event bound to it), I get a translucent grey box overlay the full area of the webview. I've eliminated -webkit-tap-highlight-color or -webkit-touch-callout as causes. What do I do to remove this behavior?
just put this style, you still have the default actions but without the gray overlay
a {
-webkit-tap-highlight-color: rgba(0,0,0,0);
}
if you want to remove the actions panel, just put this
a {
-webkit-tap-highlight-color: rgba(0,0,0,0);
-webkit-touch-callout: none;
}
And there you go! clean links at last!
My working solution is to capture and preventDefault on the touchstart event of the body of the html document. All other more explicit event handlers are unaffected. I did run into an issue with select elements, which I addressed in the body event handler (I'm using jQuery):
$('body').live(
'touchstart',
function(e){
if(e.target.localName != 'select'){
e.preventDefault();
}
}
)