Menu
JQuery's .slideUp() doesn't work after .append() is used to append value of textarea to the div.
HTML:
<html>
<body>
<div id="cont">
<textarea id="txt"></textarea>
<button onclick="click()">Click</button>
</div>
</body>
</html>
JavaScript:
function click(){
var txt = $('#txt').val();
var html = document.createElement('div');
$(html).hide().html(txt);
$('#cont').append(html);
$(html).slideUp(500);
}
I can't figure out what the problem is because when I used .show() instead of .slideUp() it works fine.
752
well...slideDown let the element be shown and slideUp let it be hidden. try
$(html).slideDown(500)
i don't think so, but I think it would be pretty easy: just put a div-element inside of the html (with $(html) it will be hard to handle) lets call it "myDiv" and put every content of the html in myDiv
then move the div outside of the window and do the animation (note to move it outside at the bottom you need to temporary disable scrolls of window)
$(document).css('overflow','hidden');
$("#myDiv").css({'top':$(document).height(), 'opacity':'0'});
/*outside of the window and transparent*/
$("#myDiv").animate({
'opacity':'1',
'top':'0'
},2000, function(){$(document).css('overflow','auto');});
i think it should work like this
75
Aside, from L. Monty already pointed out you can condense your function quite a bit by making use of jQuery's chaining.
$('button').on('click', function() {
$('<div>')
.html($('#txt').val())
.appendTo('#cont')
.slideDown(0).slideUp('slow');
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
