顯示和隱藏類（onClick）

上傳我在一個按鈕上使用Bootstrap 3中的圖形，它使用CSS3關鍵幀旋轉，我希望（。隱藏）這個類，直到點擊按鈕，然後它會出現/顯示，並旋轉...有生命，因爲它呢？顯示和隱藏類（onClick）

這裏是我的小提琴：

http://jsfiddle.net/DannyJardine/8djrcwnb/4/

<span class="glyphicon glyphicon-refresh glyphicon-refresh-animate"></span> 
Upload</button>

來源

2015-03-02 1966

看起來你正在使用AngularJS？在這種情況下閱讀這篇文章

Angular css toggle

來源

2015-03-02 15:39:43 Thorarins

遺憾是，忽略了angularJs，是有沒有去離開這個是......在這裏更新的提琴...... HTTP：//jsfiddle.net/DannyJardine/8djrcwnb/ 2 /，它不是我的代碼，所以abit miffed .. – 1966 2015-03-02 15:45:33

嘗試使用jQuery http://api.jquery.com/toggleclass/ – Thorarins 2015-03-02 16:00:36

感謝您的評論，我已經嘗試jQuery切換，無濟於事......它只是閃爍..但不隱藏 – 1966 2015-03-02 16:03:22

你可以使用CSS的這種功能，並使用jQuery的toggleClass屬性：

$('button').click(function() { 
 
    $('.togglable').toggleClass("active"); 
 
});

button { 
 
    height: 50px; /*just some styling for the button*/ 
 
    width: 50px; 
 
    border-radius: 50%; 
 
    background: red; 
 
    box-shadow: inset 2px 2px 10px white, inset -2px -2px 10px black; 
 
    outline: none; 
 
} 
 
.togglable { 
 
    font-size: 0; 
 
    height: 0; 
 
    width: 0; 
 
    transition: all 1s; /*speed of animation*/ 
 
    transform-origin:center center; 
 
    text-align:center; 
 
    margin:0 auto; 
 
} 
 
.active { 
 
    font-size: 50px; 
 
    height: 50px; 
 
    width: 400px; 
 
    transform: rotate(720deg); /*multiple of 360 to ensure animation finishes 'straight'*/ 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button></button> 
 
<div class="togglable active">Press the red button to toggle me!!!</div>

來源

2015-03-02 16:43:09 jbutler483

想通了使用顯示爲N隱藏JQuery ..測試和錯誤

$(document).ready(function() { 
$('.glyphicon-refresh-animate').hide(); 
}); 

$("button").click(function(){ 
$(".glyphicon-refresh-animate").show(); 
});

感謝你爲你的幫助......

來源

2015-03-03 10:27:07 1966

顯示和隱藏類（onClick）

回答

相關問題