webkit - css transition effect on a div

Posted by Mak Killbers on Stack Overflow See other posts from Stack Overflow or by Mak Killbers
Published on 2010-12-30T02:45:51Z Indexed on 2010/12/31 17:53 UTC
Read the original article Hit count: 292

Filed under:
|
|

I am trying to do fadein/out effect when I change innerHTML of a div. Even tried example given at safari doc

I want the div to fade-out, change the contents and then fade-in again with new content.

<style>
.cv { background-color: #eee; -webkit-transition: all 1s ease-in-out;}
.cf {opacity: 0;}
</style>
<body> 
 <div id="main"> 
  <div id="c"> OLD </div>
 </div> 
</body>
<script> 
var c = document.getElementById("c");
c.setAttribute("class", "cf");
c.innerHTML = '';
c.appendChild(fragment);
c.setAttribute("class", "cv");
</script>

Please help me here

© Stack Overflow or respective owner

Related posts about JavaScript

Related posts about css