Изменение CSS с OnClick

Question

Можно ли переключить display:block часть #about{ с display:none части #downloads с OnClick?

#about { 
    position:relative; 
    -moz-border-radius: 5px; 
    border-radius: 5px; 
    width:800px; 
    height:450px; 
    margin-left:50px; 
    margin-right:50px; 
    border:solid 2px #000000; 
    background-color:#448efc; 
    margin-bottom:5px; 
    display:block 
} 
#downloads { 
    position:relative; 
    -moz-border-radius: 5px; 
    border-radius: 5px; 
    width:800px; 
    height:450px; 
    margin-left:50px; 
    margin-right:50px; 
    border:solid 2px #000000; 
    background-color:#448efc; 
    margin-bottom:5px; 
    display:none 
} 

Heres мой OnClick код <a href="#downloads" onclick="somthing?"> им не уверен, если его можно сделать любой из вас знает, как?

Answer 1

Вы можете изменить CSS, используя JQuery.

<a href="#downloads" onclick="$('#about').css("display", "none");"> 

Answer 2

Я хотел бы предложить что-то вроде этого:

#about, #downloads { 
    /* all of the CSS rules EXCEPT display here */ 
} 
.hidden {display:none} 

Тогда ваш HTML должен быть:

<div id="about">...</div> 
<div id="downlaods" class="hidden">...</div> 

Теперь ваша ссылка может быть:

<a href="#downloads" onClick="document.getElementById('about').className = 'hidden'; 
    document.getElementById('downloads').className = '';">Downloads</a> 

Answer 3

Возможно, вы действительно ищете jQuery toggle(). потому что он не имеет смысла держать onclick событие на элементе, который уже display: none.

<div id="about" onclick="$('#downloads').toggle()"></div> 
<div id="downloads" onclick="$('#about').toggle()"></div> 

Working Fiddle

Answer 4

Похоже, вы хотите шкурой#about:

$('#downloads').click(function() { 
    $('#about').hide(); 
}); 

С этим, нет необходимости добавлять onclick атрибуты.

Answer 5

мне пришлось изменить мои quotesmarks, код ниже полностью работает для меня ....

<form action="uploadprofileaccept.php" 
class="dropzone" onclick="$('#imageform').css('display', 'none');"> 
</form>