nicci
-
Posts
1 -
Joined
-
Last visited
nicci's Achievements
Newbie (1/14)
0
Reputation
-
Hi! I started learning web design about 4 months ago. I want to become a professional web developer. I learned some html and css and I know enough to make a "static"(?) website. I started learning Javascript but can't quite put it together yet. Then I thought I will try to learn some php because it might be easier than Javascript to get my head around programming logic and then make Javascript more understandable when I go back to it. (Php is making more sense to me than Javascript, I think). A couple of days ago my sister (graphic designer) asked me whether I could do the programming for one of her designs but the client wants a lot of animation in her home page. Things like a swing that swings when you hover over it, a phone that shakes as if it's ringing and a flag that moves in the wind also when you hover it and all of these are also the links to the other pages. So I figured out how to do this in css3 but sadly this is not going to work obviously because so few browsers supports it at the moment. The I came across jstween and was sure that that will fix my problem but now I am stuck with this. <!DOCTYPE html> <html> <head> <style type="text/css"> #target { position: relative; left: 300px; top: 100px; width: 100px; height: 100px; display: block; } </style> <script type="text/javascript" src="scripts/jquery-1.10.1.js"></script> <script type="text/javascript" src="scripts/jstween-1.1.js" ></script> <script type="text/javascript"> $( '#target' ).tween({ rotate:{ start: 0, stop: 360, time: 0, duration: 2, effect:'easeInOut' } }); $.play(); </script> </head> <body> <img src="images/swing.png" id="target" /> </body> </html> I have been reading on the internet for two days trying to figure out why this won't work and I am still convinced that it is some stupid small mistake on my part. Or that I am missing something with the css. Please help!