By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
459,261 Members | 1,616 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 459,261 IT Pros & Developers. It's quick & easy.

Transition error?

P: 15
Expand|Select|Wrap|Line Numbers
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <style type="text/css"> 
  5.  
  6. div1
  7. {
  8.  
  9. height:310px;
  10. width:auto;
  11. transition:width 2s;
  12. -moz-transition:width 2s; /* Firefox 4 */
  13. -webkit-transition:width 2s; /* Safari and Chrome */
  14. -o-transition:width 2s; /* Opera */
  15. float:left;
  16. }
  17. div2
  18. {
  19.  
  20. height:310px;
  21. width:auto;
  22. transition:width 2s;
  23. -moz-transition:width 2s; /* Firefox 4 */
  24. -webkit-transition:width 2s; /* Safari and Chrome */
  25. -o-transition:width 2s; /* Opera */
  26. float:left;
  27. }
  28. div3
  29. {
  30.  
  31. height:310px;
  32. width:auto;
  33. transition:width 2s;
  34. -moz-transition:width 2s; /* Firefox 4 */
  35. -webkit-transition:width 2s; /* Safari and Chrome */
  36. -o-transition:width 2s; /* Opera */
  37. float:left;
  38. }
  39. div4
  40. {
  41.  
  42. height:310px;
  43. width:auto;
  44. transition:width 2s;
  45. -moz-transition:width 2s; /* Firefox 4 */
  46. -webkit-transition:width 2s; /* Safari and Chrome */
  47. -o-transition:width 2s; /* Opera */
  48. float:left;
  49. }
  50. div5
  51. {
  52.  
  53. height:310px;
  54. width:auto;
  55. transition:width 2s;
  56. -moz-transition:width 2s; /* Firefox 4 */
  57. -webkit-transition:width 2s; /* Safari and Chrome */
  58. -o-transition:width 2s; /* Opera */
  59. float:left;
  60. }
  61. div6
  62. {
  63.  
  64. height:310px;
  65. width:auto;
  66. transition:width 2s;
  67. -moz-transition:width 2s; /* Firefox 4 */
  68. -webkit-transition:width 2s; /* Safari and Chrome */
  69. -o-transition:width 2s; /* Opera */
  70. float:left;
  71. }
  72.  
  73.  
  74. div1:hover
  75. {
  76. background:url(usa.jpg);
  77. width:600px;
  78. }
  79. div2:hover
  80. {
  81. background:url(uk.jpg);
  82. width:600px;
  83. }
  84. div3:hover
  85. {
  86. background:url(australia.jpg);
  87. width:600px;
  88. }
  89.  
  90. </style>
  91. </head>
  92. <body>
  93. <div style="width:900px">
  94. <div1><img src="1.jpg"></div>
  95. <div2><img src="2.jpg"></div>
  96. <div3><img src="3.jpg"></div>
  97. </div>
  98.  
  99.  
  100.  
  101. </body>
  102. </html>
  103.  
  104.  
Aug 8 '12 #1
Share this Question
Share on Google+
1 Reply


Rabbit
Expert Mod 10K+
P: 12,430
You have not described the error nor the error message(s).
Aug 8 '12 #2

Post your reply

Sign in to post your reply or Sign up for a free account.