RIRedinPA Posted August 9, 2010 Share Posted August 9, 2010 what am I doing wrong here? <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html lang="en"> <head> <meta charset="utf-8"> <title>Page Title</title> <!-- meta tags --> <meta name="keywords" content=""> <meta name="description" content=""> <!-- javascript --> <script src="js/jquery-1.4.2.min.js"></script> <script src="js/jquery-ui-1.8.4.custom.min.js"></script> <script language="javascript"> $(document).ready(function(){ //declare draggable items $("#card").draggable({containment: '#board', scroll: false}); }); </script> <!-- stylesheets --> <style> * { border: 0; margin: 0; padding:0; } #board { border: 1px solid black; margin: 20px 0 0 80px; width: 800px; height: 600px; } </style> <!--conditional comments --> </head> <body> <div id="board"> <p id="card" class="draggable ui-widget-content"><img src="images/cards/card01.png" width="100"></p> </div> </body> Link to comment https://forums.phpfreaks.com/topic/210218-jquery-containing-draggable-items-only-dragging-vertically/ Share on other sites More sharing options...
RichardRotterdam Posted August 10, 2010 Share Posted August 10, 2010 It's just a simple css issue. Your paragraph elements are too wide. add the following to your css and it should be fine #board p{ width:50px; } Link to comment https://forums.phpfreaks.com/topic/210218-jquery-containing-draggable-items-only-dragging-vertically/#findComment-1097562 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.