Can someone help me figure out how to make a slider work with jQuery?
Here is the HTML code I am currently using:
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
</head>
<body>
<div id='example1' class='ui-slider-1' style="margin: 40px;">
<div class='ui-slider-handle'></div>
</div>
</body>
Included is the CSS code used for styling the slider:
.ui-slider-handle {
border:1px solid silver;
height:10px;width:10px;
background-color:black;
}
#example1 {
width:1050px;
background-color:white;
border:1px solid black;
}
And here is the jQuery code I am using to initialize the slider:
$('#example1').slider( { minValue: -100, maxValue: 100 } );
I seem to be having some trouble with the implementation. Any suggestions on what may be the issue?