Jump to content


Check out our Community Blogs

Register and join over 40,000 other developers!


Recent Status Updates

View All Updates

Photo
- - - - -

css3 transition property not working:(

CSS3 CSS css3

  • Please log in to reply
2 replies to this topic

#1 opensam

opensam

    CC Lurker

  • Just Joined
  • Pip
  • 2 posts

Posted 01 June 2011 - 09:20 AM

guys i m using chrome 11.0.696.71 doc type

<!DOCTYPE html PUBtdC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">




<html xmlns="http://www.w3.org/1999/xhtml">


and code
div
{
transition: width 2s;
-moz-transition: width 2s;
-webkit-transition: width 2s;
-o-transition: width 2s;
}
this code is not working at all...
sos
  • 0

#2 wim DC

wim DC

    Roar

  • Expert Member
  • PipPipPipPipPipPipPipPip
  • 2681 posts
  • Programming Language:Java, JavaScript, PL/SQL
  • Learning:Python

Posted 04 June 2011 - 11:31 AM

It DOES work, it just doesn't do anything. You just say that if the width changes, to do it in 2 seconds. But you never change the width.
Use this instead and you see it change when you hover over it with your mouse:
         <style type="text/css">	
		div{		
			width: 100px;
			background-color: red;
			transition: width 2s;
			-moz-transition: width 2s; 
			-webkit-transition: width 2s;
			-o-transition: width 2s; 
		} 
		
		div:hover{
			width: 200px;
		}
	</style>

  • 0

#3 opensam

opensam

    CC Lurker

  • Just Joined
  • Pip
  • 2 posts

Posted 04 June 2011 - 12:05 PM

thanx a ton buddy
  • 0





Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download