jeudi 25 décembre 2014

When Select Change Background Images Change


Hello I have a problem with html Select...When user will click one of the Value then background images have to change and appear a new Select and the old Select will disappear. I tried many things but it wasn't work...help me out please...


Here is the code:



<script>
$(document).ready(function(){
var header = $('body');

function SelectElement(valueToSelect)
{
var element = document.getElementById('test');
element.value = '1';
}
$(function() {
$('.test').click(function() {
var backgrounds = new Array(
'url(images/Main/1.png)'
, 'url(images/Main/2.jpg)'
, 'url(images/Main/3.jpg)'
, 'url(images/Main/4.jpg)'
, 'url(images/Main/5.jpg)'
, 'url(images/Main/6.jpg)'
, 'url(images/Main/7.jpg)'
, 'url(images/Main/8.jpg)'
, 'url(images/Main/9.jpg)'
, 'url(images/Main/10.jpg)'
);
});
});
var current = 0;

function nextBackground() {
current++;
current = current % backgrounds.length;
header.css('background-image', backgrounds[current]);
}
setInterval(nextBackground, 6000);

header.css('background-image', backgrounds[0]);
});
</script>
</head>
<body>
<center>
<div id="black">
<div style="margin-top:22%;margin-bottom:-22%;">
<form name="test">
<select id="test" name="test">
<option value="Select Season" selected="selected" disabled="disabled">Select Season..</option>
<option value="1" onclick="function()">Season 1</option>
<option value="Season 2">Season 2</option>
<option value="Season 3">Season 3</option>
<option value="Season 4">Season 4</option>
</select>
</form>




Aucun commentaire:

Enregistrer un commentaire