Help with javascript code in Dreamweaver?

i had code want add ease slow down height change on mouse in , mouse out right jumps charply 1 state want add slight ease little more fluid.

 

function enlarge(id)

            {document.getelementbyid(id).style.height = '220px';}

            function shrink(id)

            {document.getelementbyid(id).style.height = '130px';}

            function toggle(id)

            {if(document.getelementbyid(id).style.height == "130px")

            {document.getelementbyid(id).style.height = "220px";}

            else{document.getelementbyid(id).style.height = "130px";}}

 

i making drop down menu in dreamweaver had use javascript because way menu bar specialized looking. how make mouseover function go little bit slower?

            function enlarge(id)

            {document.getelementbyid(id).classname = 'expanded';}

            function shrink(id)

            {document.getelementbyid(id).classname = 'contracted';}

            function toggle(id)

            {if(document.getelementbyid(id).classname == "contracted")

            {document.getelementbyid(id).classname = "expanded";}

            else{document.getelementbyid(id).classname = "contracted";}}

 

<style>

expanded {

height:220px;

transition: 400ms;

}

 

contracted {

height:130px;

transition: 400ms;

}

</style>

 

then top_menu needs have class changed class="contracted". you'll want make both expanded , contracted styles include of other specifics top_menu div nothing gets dropped.

 

edited add: forgot transition css, make sure that's last in css listings. may want add in -moz-transition, -webkit-transition , -o-transition. transitions not supported ie (bastages)

More discussions in Dreamweaver support forum

adobe