Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Yaswanth Goli
6,872 PointsProblem with draggable function in Jquery UI
<div id="parent">
<div id="content"></div>
</div>
i am using this code
$("#content").draggable({containment:"parent"});
but its not working please help
Yaswanth Goli
6,872 Pointsok then my css is```#parent{width:200px;height200px;border:1px solid #000;}
content{width:50px; height:50px border"1px solid #000;}```
now explain please
Benjamin Simmons
50,431 PointsDid you check the fiddle?
Yaswanth Goli
6,872 Pointsits working there but it not working in the project i am doing
Benjamin Simmons
50,431 PointsWell, for one, you are missing a colon between height and 200px on #parent
Benjamin Simmons
50,431 Pointsupdated fiddle with your css If you are still having problems after that, then you need to let us know more about your project and show more code, it may be something else interfering.
Yaswanth Goli
6,872 Pointsits not the issue that is not the css i have developed its just a prototype
Benjamin Simmons
50,431 PointsMy bad, had a typo. here is another updated fiddle
Benjamin Simmons
50,431 PointsSounds like we cannot help if you dont share more
Yaswanth Goli
6,872 Pointsmy code is working now the issue is i am using both jquery.min.js and jquery.tools.min.js where jquery.tools.min.js is blocking my code to be draggable. but thanks for your support
James Barnett
39,199 PointsThat shouldn't happen, ccreate a jsbin with all of your code so we can see what is going on.
Yaswanth Goli
6,872 Pointsthis my code click here
Yaswanth Goli
6,872 Pointsthe draggable div is not working now
5 Answers
Benjamin Simmons
50,431 PointsYour problem is that you have told #content that it is to be bound to #parent, and you have not given #parent any properties to know where it resides on the page/dom. Give parent a width and height, and your issue should be fixed.
Check out this fiddle
Benjamin Simmons
50,431 PointsYou have a typo in your jsbin code that is breaking it. You currently have:
$(":range").rangeinput();
You want:
$(".range").rangeinput();
This will fix your problem and make it work again, but can I ask why you are using jquery tools for the slider and not the jquery ui slider. jquery tools is somewhat outdated to my knowledge.
Yaswanth Goli
6,872 Pointscan u please make the change for code and paste the link
James Barnett
39,199 Points> jquery tools is somewhat outdated to my knowledge.
Looks like the JQuery Tools project was abandoned nearly 2 years ago
Yaswanth Goli
6,872 PointsOk then what is the best? So that i can go with for tools
Benjamin Simmons
50,431 Points
Yaswanth Goli
6,872 PointsI have did it already but problem is style should retain for range but styling is gone
Benjamin Simmons
50,431 PointsIm not seeing what you mean?
Yaswanth Goli
6,872 PointsIn my problem i need the div draggable and the range control should be worked with styles applied, please make both work
Benjamin Simmons
50,431 PointsAll you need to do is add the class in the markup. If you are having trouble with this, I suggest going back to through the HTML & CSS courses
Yaswanth Goli
6,872 PointsI have made change to my code and it working fine without jquery.tools.min.js but can u suggest other tool library other than jquery.ui and thanks for your help
James Barnett
39,199 PointsJames Barnett
39,199 PointsWhere is your CSS? Your divs don't have any size without CSS.