Animating inline elements with JQuery
- by rnielsen
I am trying to show and hide an inline element (eg a span) using jquery. If I just use toggle(), it works as expected but if I use toggle("slow") to give it an animation, it turns the span into a block element and therefore inserts breaks. Is animation possible with inline elements? I would prefer a smooth sliding if possible, rather than a fade in.
Thanks.
<script type="text/javascript">
$(function(){
$('.toggle').click(function() { $('.hide').toggle("slow") });
});
</script>
<p>Hello <span class="hide">there</span> jquery</p>
<button class="toggle">Toggle</button>