I simply can't figure out what I'm doing wrong with this really simple slideDown jQuery function. It's supposed to animate the appearance of a div
when another div
is clicked. But, when I click the firing div
, nothing happens. Where is my mistake here?
HTML
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
#testdiv {background-color:#999900; height:100px; width:100px; display:none;}
</style>
<script src="/personal/xnb1159/Shared%20Documents/Test/jquery-1.11.1.js"></script>
<script>
$("#test").click(function() {
$("#testdiv").slideDown("fast",function() {
// Animation complete.
});
});
</script>
</head>
<body>
<div id="test">Click me.</div>
<div id="testdiv"></div>
</body>
</html>
Wrap your jquery code in a document.ready so it runs when the elements are all loaded.
$(function() {
$("#test").click(function() {
$("#testdiv").slideDown("fast",function() {
// Animation complete.
});
});
});
Or add your JS scrip at the end of your body tag.