I have an image slider widget in my application. I am using jquery cycle for that.. I have a drop down menu where I can change the effects of the slider. But I need to insert this image slider in more than one place in a single page. And for the drop down menu I have used id.. so when I insert the image in more than one page in a single page the effect would be same for all . Please find the code below.. Any thoughts on this would be appreciated.?/ (I am just learning jquery and JS). I want to retrieve the value of effects using pure javascript. Just for the initialization of effects value I would use jquery..
Jquery code:
var effects_id = document.getElementById(‘slideshow_effects’).value;
<script type=’text/javascript’ src=’https://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js’/></script><script type=’text/javascript’ src=’/javascripts/jquery.cycle.all.min.js’/></script>
<script type=’text/javascript’>
$.noConflict();
jQuery(document).ready(function(){
jQuery(‘.editor_slideshow’).cycle({
fx: ‘”+effects_id+”‘,
speed: 1000,
timeout: 2000
});});
</script>
Drop down menu:
<select id=”slideshow_effects”>
<option value=”fade”>Fade</option>
<option value=”fadeZoom”>FadeZoom</option>
<option value=”cover”>Cover</option>
<option value=”toss”>Toss</option>
<option value=”blindY”>BlindY</option>
</select>