的Javascript翻转，隐藏

页

的部分我有滚动的问题上，并改变光标为手悬停在这里两个图像是我用了隐藏/显示代码：的Javascript翻转，隐藏

<div class="listing"> 
<span style="float:right; margin:-10px 100px 0px 20px;">Change view:&nbsp;</span> 
<input class="listing" id="List" style="visibility: hidden;" name="listing" onclick="hideForm()" type="radio"> 
<label class="listing" for="List"> 
<img src="/devsite/images/icons/row.png" alt="List" title=" List " border="0"></label> 


<input class="listing" id="Grid" style="visibility: hidden;" name="listing" onclick="hideForm()" type="radio"> 
<label class="listing" for="Grid"> 
<img src="/devsite/images/icons/table.png" alt="Grid" title=" Grid " border="0"> </label> 
</div> 

    <div id="formdiv" style="display: block;"> some stuff </div> 

    <div id="formdiv2" style="display: block;"> some different stuff </div>

的JavaScript：

<script language="javascript"> 
function hideForm(){ 
if (document.getElementById('List').checked==true){ 
    document.getElementById('formdiv').style.display="block"; 
    document.getElementById('formdiv2').style.display="none"; 
} else { 
    document.getElementById('formdiv').style.display="none"; 
    document.getElementById('formdiv2').style.display="block"; 
}; 

if (document.getElementById('Grid').checked==true){ 
    document.getElementById('formdiv').style.display="none"; 
    document.getElementById('formdiv2').style.display="block"; 
} else { 
    document.getElementById('formdiv').style.display="block"; 
    document.getElementById('formdiv2').style.display="none"; 
}; 


} 

</script>

我需要的是一个翻转光标变化，并在选定的单选按钮...隐藏/显示可见的背景颜色变化工作正常

来源

2015-06-12 Cannuck1964

你可以添加单选按钮的HTML代码？ – jumojer

你使用jQuery吗？我没有在你的javascript中看到它。 – jrummell

jquery-1.10.1.min.js被加载，单选按钮使用基于=“”的标签的图像，它工作正常... – Cannuck1964

对于background颜色改变你可以使用这个：

YourElement.style.background = "#000000"

对于cursor变化：

YourElement.style.cursor = "type"

对于不同类型的光标：cursor types doc

来源

2015-06-12 14:35:54 alexandreferris

我会在javascript区使用这个：ie：listing.style.background =“＃000000” – Cannuck1964

是的，在你的条件下。例如当你检查List时，你想要改变背景颜色，而不是把它放在List列表中。 – alexandreferris

显示光标悬停尝试下面的CSS ：

img:hover { 
cursor:pointer; 
}

为背景，使用jQuery你可以做到以下几点：

$("#elementid").css("background", "#000000")

来源

2015-06-12 14:41:12 jumojer

我已经改变了无线电代码：

<span style="float:right; margin:-10px 100px 0px 20px;">Change view:&nbsp;</span> 
<input class="listing" id="List" style="visibility: hidden;" name="listing" onclick="hideForm()" type="radio"> 
<label class="List" for="List"> 
<img src="/devsite/images/icons/row.png" alt="List" title=" List " border="0"></label> 


<input class="listing" id="Grid" style="visibility: hidden;" name="listing" onclick="hideForm()" type="radio"> 
<label class="Grid" for="Grid"> 
<img src="/devsite/images/icons/table.png" alt="Grid" title=" Grid " border="0"> </label> 

         </span>

和JavaScript来：

<script language="javascript"> 
function hideForm(){ 
if (document.getElementById('List').checked==true){ 
    document.getElementById('formdiv').style.display="block"; 
    document.getElementById('formdiv2').style.display="none"; 
    List.style.background = "#FFFFFF"; 
    Grid.style.background = "#111111"; 
    List.style.cursor = "pointer"; 
    Grid.style.cursor = "pointer"; 
} else { 
    document.getElementById('formdiv').style.display="none"; 
    document.getElementById('formdiv2').style.display="block"; 
    List.style.background = "#111111"; 
    Grid.style.background = "#FFFFFF"; 
    List.style.cursor = "pointer"; 
    Grid.style.cursor = "pointer"; 
}; 

if (document.getElementById('Grid').checked==true){ 
    document.getElementById('formdiv').style.display="none"; 
    document.getElementById('formdiv2').style.display="block"; 
    List.style.background = "#111111"; 
    Grid.style.background = "#FFFFFF"; 
    List.style.cursor = "pointer"; 
    Grid.style.cursor = "pointer"; 
} else { 
    document.getElementById('formdiv').style.display="block"; 
    document.getElementById('formdiv2').style.display="none"; 
    List.style.background = "#FFFFFF"; 
    Grid.style.background = "#111111"; 
    List.style.cursor = "pointer"; 
    Grid.style.cursor = "pointer"; 
}; 


} 
</script>

这只是越来越混乱.....

来源

2015-06-12 15:13:12 Cannuck1964

的Javascript翻转，隐藏

回答

相关问题