在相同的按鈕點擊，Div淡出和淡入

我想創建一個單頁的網站，點擊按鈕的impressum-div會淡入。另一個點擊相同的按鈕，然後淡出impressum-div 。在相同的按鈕點擊，Div淡出和淡入

我已經管理它淡入點擊div。但是，當我嘗試使用「如果」整個事情不再工作。我已經發現了一些的竅門在這裏和嘗試所有這些，但沒有什麼工作對我來說..

這裏我的腳本，代碼：

<script type="text/javascript"> 
    $(document).ready(function() { 
     function display() { 

      if (document.getElementById("impressum").style=="none") { 
       $('#impressum').fadeIn(); 
      } 
      if (document.getElementById("impressum").style=="block") { 
       $('#impressum').fadeOut(); 
      } 
     } 
    }); 
</script>

我想這幾個版本（帶。點擊（）等等..），所以這可能是完全錯誤的。

這裏我的HTML代碼：

<input type="button" id="iButton" value="Impressum" onclick="javascript:display()"/> 

     <div id="impressum" style="display:none"> 

     <p>Here Impressum</p></div>

幫助非常感激，如果你能發佈一個功能齊全，將他的整個最好的，因爲我只是把部分一起瘋狂..

問候

來源

2014-02-10 user3292064

檢查此鏈接：http://stackoverflow.com/questions/2147788/jquery-click -btn-fade-in-out –

只需使用fadeToggle（）

<input type="button" id="iButton" value="Impressum" onclick="javascript:display()" /> 
<div id="impressum" style="display:none"> 
    <p>Here Impressum</p> 
</div>

然後

$(document).ready(function() { 
    $('#iButton').click(function() { 
     $('#impressum').stop(true).fadeToggle(); 
    }) 
});

演示：Fiddle

來源

2014-02-10 09:03:11

OMG Your My Hero，這完全有效！ – user3292064

HTML

<div id="impressum" style="display:none"> 
    <p>Here Impressum</p> 
</div>

的JavaScript

$('#iButton').click(function() { 
    $('#impressum').stop(true).fadeToggle(); 
});

小提琴：http://jsfiddle.net/xKpLe/

來源

2014-02-10 09:09:09 Howard

你不能檢索display值那樣的，你需要使用window.getComputedStyle：

var elem = document.getElementById("impressum"), 
    display = window.getComputedStyle(elem,null).getPropertyValue("display");

Fiddle Demo

來源

2014-02-10 09:10:06 Felix

/* 1: <div onclick="display(this);"></div>*/ 
var display = function(elm){ 
    var status = G(elm).attrib('data-display')||'false'; 

    if(status=='false'){ 
     G(elm).css({display:'block'}); 
     G(elm).attrib('data-display', 'true'); 
     return false;} 

    if(status=='true'){ 
     G(elm).css({display:'none'}); 
     G(elm).attrib('data-display', 'false'); 
     return false;} 

    }; 



    /* 2 */ 
    /* elm.onclick = display;*/ 
var display = function(ev){ 
    var elm = this||G(ev).source(); //Choice 
    var status = G(elm).attrib('data-display')||'false'; 

    if(status=='false'){ 
     G(elm).css({display:'block'}); 
     G(elm).attrib('data-display', 'true'); 
     return false;} 

    if(status=='true'){ 
     G(elm).css({display:'none'}); 
     G(elm).attrib('data-display', 'false'); 
     return false;} 

    };

來源

2014-02-10 09:43:20

在相同的按鈕點擊，Div淡出和淡入

回答

相關問題