Пожалуйста, установите эту функцию показать / скрыть кнопку на медленной скорости:
<button id="trmtn" onclick="trclick(this);"><span id="nod_trmtn">[+]</span>File</button>
Файл скрыть:
<div id="bd_trmtn" style="display: none">
HELLO!
</div>
Эта функция:
var d = document;
function trclick(a){
var view,valbt;
var c=d.getElementById('bd_'+a.id);
var e=d.getElementById('nod_'+a.id);
view=c.style.display;c.style.display=(view==''?'none':'');
valbt=(view==''?'[+]':'[-]');
e.innerHTML=valbt;
}
0
jmsmarcelo
15 Дек 2015 в 21:33
3 ответа
Лучший ответ
Использование jQuery делает это легко. Проверьте скрипку: http://jsfiddle.net/f92vczpm/
HTML:
<button id="trmtn"><span id="nod_trmtn">[+]</span>File</button>
<div id="bd_trmtn" style="display:none;">
HELLO!
</div>
Javascript:
$(function(){
$('#trmtn').click(function(){
// get the ID of the button that was clicked
var thisID = $(this).attr('id');
// determine if your button will have a plus or minus after the toggle
spanText = $('#bd_' + thisID).is(':visible') ? "[+]": "[-]";
// get a reference to the span tag so you can update it in the callback function
span = $(this).find('span');
// toggle the div with speed of "slow" for slow motion. then use callback function to change the button text
$('#bd_' + thisID).slideToggle("slow", function(){ $(span).text(spanText); });
})
});
0
Gregg Duncan
15 Дек 2015 в 19:00
Используя jQuery
вы можете сделать это следующим образом. fadeIn()
показывает и fadeOut()
скрывает элемент в течение заданного времени. Надеюсь, что это поможет вам.
$('#trmtn').click(function(){
var bd = $('#bd_trmtn');
if(!bd.is(':visible')){
bd.fadeIn(2000); //take 2s to show
$(this).find('#nod_trmtn').html('[-]');
}else{
bd.fadeOut(2000); //take 2s to hide
$(this).find('#nod_trmtn').html('[+]');
}
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="trmtn"><span id="nod_trmtn">[+]</span>File</button>
<div id="bd_trmtn" style="display: none">
HELLO!
</div>
0
Ibrahim Khan
15 Дек 2015 в 18:47
Для этого вам нужно будет включить версию jQuery.
$('selector').hide(speed,callback);
$('selector').show(speed,callback);
Например, чтобы оживить его исчезновение (медленно)
$('element').hide(1000);
Или же
$("element").hide('slow');
0
nestedl00p
15 Дек 2015 в 18:45
Похожие вопросы
Новые вопросы
javascript
По вопросам программирования на ECMAScript (JavaScript / JS) и его различных диалектах / реализациях (кроме ActionScript). Включите все соответствующие теги в свой вопрос; например, [node.js], [jquery], [json] и т. д.