Beste mede webdesigners,
Ik heb een issue met jquery. Ik heb een reeks sliders gemaakt waarbij de waardes van de slide die je op dat moment aanpast onder de sliders wordt weergeven nu is het de bedoeling dat die niet de waardes van alle slides bij elkaar opgeteld. Nu loop ik daar in het denken aan een oplossing in vast. Wie kan me hierbij verder helpen.
source code:
<html>
<head>
<meta charset="utf-8" />
<title>jQuery UI Slider - Snap to increments</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css" />
<style>
#Strength, #Vitality, #Magic, #Spirit, #Speed, #Accuracy, #Evasion {
width: 300px;
}
#Strength, #Vitality, #Magic, #Spirit, #Speed, #Accuracy, #Evasion, .ui-slider-range { background: #010039; }
#Strength, #Vitality, #Magic, #Spirit, #Speed, #Accuracy, #Evasion, .ui-slider-handle { border-color: #010039; }
</style>
<script>
$(function() {
$( "#Strength, #Vitality, #Magic, #Spirit, #Speed, #Accuracy, #Evasion" ).slider({
value:100,
min: 0,
max: 3500,
step: 50,
slide: function( event, ui ) {
$( "#amount" ).val( ui.value );
}
});
$( "#amount" ).val( $( "#slider" ).slider( "value" ) );
});
</script>
</head>
<body>
<dl>
<dt>Strength</dt>
<dd><div id="Strength"></div></dd>
</dl>
<dl>
<dt>Vitality</dt>
<dd><div id="Vitality"></div></dd>
</dl>
<dl>
<dt>Magic</dt>
<dd><div id="Magic"></div></dd>
</dl>
<dl>
<dt>Spirit</dt>
<dd><div id="Spirit"></div></dd>
</dl>
<dl>
<dt>Speed</dt>
<dd><div id="Speed"></div></dd>
</dl>
<dl>
<dt>Accuracy</dt>
<dd><div id="Accuracy"></div></dd>
</dl>
<dl>
<dt>Evasion</dt>
<dd><div id="Evasion"></div></dd>
</dl>
<dl>
<dt><br />Total Amount Used</dt>
<dd><p>
<input type="text" id="amount" style="border: 0; color: #f6931f; font-weight: bold;" />
</p></dd>
</dl>
</body>
</html>
Alvast bijvoorbaat dank,
Met vriendelijke groet,
Vinnoko
Ik heb een issue met jquery. Ik heb een reeks sliders gemaakt waarbij de waardes van de slide die je op dat moment aanpast onder de sliders wordt weergeven nu is het de bedoeling dat die niet de waardes van alle slides bij elkaar opgeteld. Nu loop ik daar in het denken aan een oplossing in vast. Wie kan me hierbij verder helpen.
source code:
<html>
<head>
<meta charset="utf-8" />
<title>jQuery UI Slider - Snap to increments</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css" />
<style>
#Strength, #Vitality, #Magic, #Spirit, #Speed, #Accuracy, #Evasion {
width: 300px;
}
#Strength, #Vitality, #Magic, #Spirit, #Speed, #Accuracy, #Evasion, .ui-slider-range { background: #010039; }
#Strength, #Vitality, #Magic, #Spirit, #Speed, #Accuracy, #Evasion, .ui-slider-handle { border-color: #010039; }
</style>
<script>
$(function() {
$( "#Strength, #Vitality, #Magic, #Spirit, #Speed, #Accuracy, #Evasion" ).slider({
value:100,
min: 0,
max: 3500,
step: 50,
slide: function( event, ui ) {
$( "#amount" ).val( ui.value );
}
});
$( "#amount" ).val( $( "#slider" ).slider( "value" ) );
});
</script>
</head>
<body>
<dl>
<dt>Strength</dt>
<dd><div id="Strength"></div></dd>
</dl>
<dl>
<dt>Vitality</dt>
<dd><div id="Vitality"></div></dd>
</dl>
<dl>
<dt>Magic</dt>
<dd><div id="Magic"></div></dd>
</dl>
<dl>
<dt>Spirit</dt>
<dd><div id="Spirit"></div></dd>
</dl>
<dl>
<dt>Speed</dt>
<dd><div id="Speed"></div></dd>
</dl>
<dl>
<dt>Accuracy</dt>
<dd><div id="Accuracy"></div></dd>
</dl>
<dl>
<dt>Evasion</dt>
<dd><div id="Evasion"></div></dd>
</dl>
<dl>
<dt><br />Total Amount Used</dt>
<dd><p>
<input type="text" id="amount" style="border: 0; color: #f6931f; font-weight: bold;" />
</p></dd>
</dl>
</body>
</html>
Alvast bijvoorbaat dank,
Met vriendelijke groet,
Vinnoko
:strip_exif()/u/27216/bosmonster_dropdown.gif?f=community)
:strip_exif()/u/73955/foxavatar-60.gif?f=community){kind=avatar}
/u/107051/jeroenmadtrix60.png?f=community)