Changing the slider value programatically
I have a page that contains my jquery slider code. That page calls a
modal page (via Ajax). The modal page has the actual slider DIV tag
on it. I'm trying to figure out how to set the starting point of the
slider based upon the modal settings (which are different depending on
the link passed). Nothing I have tried seems to work. Am I doing
this incorrectly? Thanks.
Main page:
<script type="text/javascript">
<!--
$(document).ready(function() {
$('#addItem, .editItem').click(function(e) {
e.preventDefault();
// load the contact form using ajax
$.get("modalForm.cfm", {'action' : $(this).attr
("name")}, function (data){
// create a modal dialog with the data
var d = $("<div></div>").append(data);
$(d).modal({
overlay:80,
overlayCss:
{backgroundColor:"#c0c0c0"},
escClose: true,
overlayClose: true,
// position: [e.pageY,e.pageX],
onOpen: function(modal) {
modal.overlay.fadeIn(5,
function() {
modal.data.hide();
modal.container.fadeIn
(5, function() {
modal.data.slideDown('fast');
});
});
}
});
$("#slider").slider({
value:80,
min: 20,
max: 100,
step: 20,
animate: true,
orientation: 'horizontal',
slide: function(event, ui) {
$("#slideramount").val
(ui.value);
}
});
});
});
});
// -->
</script>
------------------------
ModalForm.cfm:
<script type="text/javascript">
<!--
#slider({ value: 60 });
// -->
</script>
<div id="slider" style="width:150px;font-size: 9px;font-family:
Arial;"></div>