Menu
I currently have popups on a site I'm developing through version 2 of fancybox. I'm using fancybox because I need to be able to submit forms through said popups.
Now, I've actually found another thread that got fancybox version 1 to work with a jquery plugin called easydrag but the problem is that in that version, although the popup was draggable, you couldn't interact with the form, which is obviously a major problem. Knowing that someone got fancybox version 1 to be draggable makes me think it must be possible with version 2 as well, and ideally with the jqueryui function draggable().
Now with the version 1 solution, the developer simply assigned the draggable property to the ".fancybox-outer" class and it worked, because fancbox outer was the parent div. In version 2, however, that is not the case, as fancybox outer is buried under ".fancybox-wrap" and ".fancybox-skin" neither of which work in place of ".fancybox-outer". I even went into the fancbox jquery and added my own id to ".fancybox-wrap" called "#fancybox321" - still no good.
If anyone has any ideas, I'd love some help. Source code of a test page I made is below. You can see it in action on my website at http://lennoxwebdesign.com/test-draggable.php - obviously make sure your browser allows popups.
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test-draggable</title>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script type="text/javascript" src="jquery.fancybox.js"></script>
<link rel="stylesheet" type="text/css" href="jquery.fancybox.css" media="screen" />
<script type="text/javascript">
$(document).ready(function() {
$('.fancybox').fancybox();
});
</script>
<script>
$(function() {
$( "#fancybox321" ).draggable();
});
</script>
</head>
<body>
<a class="fancybox fancybox.iframe" href="test-popup-form.php">popup</a>
</body>
763
If you are using jQuery-UI you can do following:
jQuery("#fancybox321").fancybox({
beforeShow: function() {
this.wrap.draggable();
}
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
