Hover image - part of forms appears untill hover another How?
Posted
by
Mac
on Stack Overflow
See other posts from Stack Overflow
or by Mac
Published on 2013-11-07T09:25:13Z
Indexed on
2013/11/07
9:54 UTC
Read the original article
Hit count: 205
Im trying to make part of my form/questionnaire appears when hover on image and stay active untill hover another image next to it. and repeat it on 7 images. Of course I need the cheched checkboxes to stay after they'll be hidden so you can come back to them by hover the image and for ex. correct answers and so on..
I was using a j code:
<script type="text/javascript">
$("#Oobj51").hover(function(){
$('#Oobj58').show();
},function(){
$('#Oobj58').hide();
});
</script>
it works to another elements on my page but not to the form.
how can i do it maybe with css class or another j code. Thanks!
Parts of html: (let's say I want to hover on "Oobj56" and make "Oobj58" appears and stay as I said before...)
<div id="Oobj56">
<button type="submit" class="przed6" onmouseover="this.className='po6'"
onmouseout="this.className='przed6'" />
</div>
<div id="Oobj57">
<button type="submit" class="przed7" onmouseover="this.className='po7'"
onmouseout="this.className='przed7'" />
</div>
<div id="Oobj60">
<form action="mailto:" method="post" enctype="text/plain">
<div id="Oobj59">
<input type="text" input size="8" name="imie" placeholder="imie">
<input type="text" input size="11" name="numer" placeholder="numer telefonu">
<br><br>
<select name="miasto">
<option selected="Miasto">Miasto</option>
<option>Wroclaw</option>
<option>Warszawa</option>
<option>Kraków</option>
<option>Trójmiasto</option>
<option>Poznan</option>
<option>Szczecin</option>
<option>Torun</option>
<option>Lódz</option>
<option>Bydgoszcz</option>
<option>Lublin</option>
<option>Katowice</option>
</select>
<select name="wiek">
<option selected="selected">Wiek</option>
<option> <15 </option>
<option>15-19</option>
<option>20-24</option>
<option>25-29</option>
<option>30-34</option>
<option>35-39</option>
<option>40-44</option>
<option>45-49</option>
<option>50-54</option>
<option>55-59</option>
<option>60-64</option>
<option>65-69</option>
<option>70-74</option>
<option> >75 </option>
</select>
<select name="plec">
<option selected="selected">Plec</option>
<option>Mezczyzna</option>
<option>Kobieta</option>
</select></div>
<div id="Oobj58">
<script language="JavaScript">
function toggle(source) {
checkboxes = document.getElementsByName('sport');
for(var i=0, n=checkboxes.length;i<n;i++) {
checkboxes[i].checked = source.checked;
}
}
</script>
<input type="checkbox" onClick="toggle(this)" /><br>
<input type="checkbox" name="sport" value="gym" />silownia<br />
<input type="checkbox" name="sport" value="fitness" />fitness<br />
<input type="checkbox" name="sport" value="noga" />pilka nozna<br />
<input type="checkbox" name="sport" value="kosz" />koszykówka<br />
<input type="checkbox" name="sport" value="siata" />siatkówka<br />
<input type="checkbox" name="sport" value="ameryka" />football amerykanski<br />
<input type="checkbox" name="sport" value="konie" />jezdziectwo konne<br />
<input type="checkbox" name="sport" value="basen" />basen/sporty wodne<br />
<input type="checkbox" name="sport" value="zima" />sporty zimowe<br />
</div>
<div id="Oobj15">
<input type="submit" style="font-family: Open Sans;" value="Wyslij" class="wyslij" />
</div></form>
</div>
© Stack Overflow or respective owner