Question

我试图让我的表格/问卷的一部分出现在悬停在图像上并保持活跃状态，直到将鼠标悬停在旁边的另一个图像上。并在7张图片上重复。当然，我需要将隐藏的复选框保留在它们被隐藏之后，这样你就可以通过将图像悬停在前面来回复它们。正确答案等等..

我使用的是j代码：

<script type="text/javascript"> 
$("#Oobj51").hover(function(){
$('#Oobj58').show();
},function(){
$('#Oobj58').hide();
});
</script>

它适用于我页面上的其他元素，但不适用于表单。

我怎么能用css类或其他j代码做到这一点。谢谢！

html的部分:(假设我想悬停在“Oobj56”上并让“Oobj58”出现并按照我之前说的那样停留......）

<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="imię">

<input type="text" input size="11" name="numer" placeholder="numer telefonu">
<br><br>

<select name="miasto">
<option selected="Miasto">Miasto</option>
<option>Wrocław</option>
    <option>Warszawa</option>
<option>Kraków</option>
<option>Trójmiasto</option>
<option>Poznań</option>
    <option>Szczecin</option>
<option>Toruń</option>
<option>Łódź</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">Płeć</option>
<option>Mężczyzna</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" />siłownia<br />
<input type="checkbox" name="sport" value="fitness" />fitness<br />
<input type="checkbox" name="sport" value="noga" />piłka nożna<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 amerykański<br />
<input type="checkbox" name="sport" value="konie" />jeździectwo 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="Wyślij" class="wyslij" />
</div></form>


</div>

类到“Oobj57”是

.przed7{
background: url('image/praca.png') no-repeat;
width: 84px;
height: 84px;
border-style: none;
}

.po7{
background: url('image/praca_wybr.png') no-repeat;
width: 84px;
height: 84px;
border-style: none;
}

Answer 1

我不确定我是否理解了你的问题。

我想你可以在图片标签中使用onmouseover事件属性。

悬停图像 - 表单的一部分显示直到另一个如何？

1 个答案: