SitePoint Sponsor

User Tag List

Results 1 to 17 of 17

Thread: Rotate Script

  1. #1
    Non-Member
    Join Date
    Jan 2008
    Location
    N43 44.4824', W079 13.9408
    Posts
    2,220
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Rotate Script

    I've been looking for a script that could take these circles which would be individual placed within a ID and each circle would rotate separately, but would cause the other circles to follow along and rotate (think gears) the white in the middle is the center of the circle as this is important. When you drag your mouse left or right you could speed up, slow down the rotation of all the circles that sums up the type of script I'm hoping to find !


  2. #2
    Non-Member
    Join Date
    Dec 2010
    Location
    /home/pc
    Posts
    186
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I think there is something wrong with your gears.

    Say they are numbered

    1 2 3

    4 5 6

    If gear 1 is turning clockwise then gears 2 and 4 will be turning anti-clockwise. Since gear 4 is turning anti-clockwise, it will try to turn gear 2 clockwise. But gear 2 is already being turned anti-clockwise by gear 1. So which direction is gear 2 supposed to be turning in?

  3. #3
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,684
    Mentioned
    100 Post(s)
    Tagged
    4 Thread(s)
    There would need to be a deliberate gap between some of the turning gears, such as in this example:

    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  4. #4
    Non-Member
    Join Date
    Dec 2010
    Location
    /home/pc
    Posts
    186
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by aidos View Post
    I think there is something wrong with your gears.

    Say they are numbered

    1 2 3

    4 5 6

    If gear 1 is turning clockwise then gears 2 and 4 will be turning anti-clockwise. Since gear 4 is turning anti-clockwise, it will try to turn gear 2 clockwise. But gear 2 is already being turned anti-clockwise by gear 1. So which direction is gear 2 supposed to be turning in?
    And in addition, your circles are solid black with a white solid disc centre, how could you tell if the circles are turning or not unless you have some sort of marker, like a dot or whatever somewhere on the black part of the circle.

  5. #5
    Non-Member
    Join Date
    Jan 2008
    Location
    N43 44.4824', W079 13.9408
    Posts
    2,220
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    PMW57 is on the right track. The circles are just a fill-in !
    The circles/gears are going to move all in one direction as seen in post #3

  6. #6
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,789
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    Quote Originally Posted by SiberianHuskey View Post
    The circles/gears are going to move all in one direction as seen in post #3
    Are the circles/gears going to all move in one direction (eg all clockwise)

    or are they going to move in opposite directions as seen in post 3 (where two move clockwise and the third moves anti-clockwise)?
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  7. #7
    Non-Member
    Join Date
    Jan 2008
    Location
    N43 44.4824', W079 13.9408
    Posts
    2,220
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The gears are going to move in opposite directions, as in Post #3.

  8. #8
    Non-Member
    Join Date
    Dec 2010
    Location
    /home/pc
    Posts
    186
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by SiberianHuskey View Post
    The gears are going to move in opposite directions, as in Post #3.
    That is what I implied in Post #2. So which gears are actually in contact with each other because they can't all be contacting their neigbouring gears (as in your op) as I suggested in Post #2.

  9. #9
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,684
    Mentioned
    100 Post(s)
    Tagged
    4 Thread(s)
    Going on the following layout of the gears:

    Code:
    1  2  3
      4  5  6
    It would work if there were a slight separation between 4 & 2, and 5 & 3
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  10. #10
    Non-Member
    Join Date
    Jan 2008
    Location
    N43 44.4824', W079 13.9408
    Posts
    2,220
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    1 2 3
    4 5 6

    Gear 1 would move clockwise
    Gear 2 would move anticlockwise
    Gear 3 would move clockwise
    Gear 4 would move anticlockwise
    Gear 5 would move anticlockwise
    Gear 6 would move clockwise

  11. #11
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,684
    Mentioned
    100 Post(s)
    Tagged
    4 Thread(s)
    So there needs to be a gap between 2&5, 2&6, 3&6, 4&5, which completely separate the 5+6 set of gears from the other set.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  12. #12
    Non-Member
    Join Date
    Jan 2008
    Location
    N43 44.4824', W079 13.9408
    Posts
    2,220
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    A gap but they must rotate as gears would.

  13. #13
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,684
    Mentioned
    100 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by SiberianHuskey View Post
    A gap but they must rotate as gears would.
    Well it sounds like we've worked out some of the issues with this, and are close to being able to put together a design document for the process.

    At this point I'd normally ask, so what's the budget?
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  14. #14
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,684
    Mentioned
    100 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by SiberianHuskey View Post
    A gap but they must rotate as gears would.
    Well it sounds like we've worked out some of the issues with this, and are close to being able to put together a design document for the process.

    At this point I'd normally ask, so what's the budget?
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  15. #15
    Non-Member
    Join Date
    Jan 2008
    Location
    N43 44.4824', W079 13.9408
    Posts
    2,220
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Currently my budget for this is nada, isn't there something like this already available ?

  16. #16
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,684
    Mentioned
    100 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by SiberianHuskey View Post
    Currently my budget for this is nada, isn't there something like this already available ?
    If there is, we'll let you know.

    Of the options that require some work, they are using Flash, or creating an animated image of some kind.

    Typically though, the best animated cog logos come from people who know something about animation. Most animations are one-off, and become the property of the client who commissions them. You might find some of those people who are willing to dedicate their time and resources for free to create a one-off piece for you, but then the end result may not be to your liking.

    What you could do if you want it done for free, is to do the work yourself. Go to an animation forum and get their help so that you can do the work to create the animation that you require.
    Last edited by paul_wilkins; Jan 8, 2011 at 17:26.
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  17. #17
    Non-Member
    Join Date
    Jan 2008
    Location
    N43 44.4824', W079 13.9408
    Posts
    2,220
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    If there is, we'll let you know.

    Of the options that require some work, they are using Flash, or creating an animated image of some kind.
    I know how to create an animation, I want interactivity and I don't want to use Flash, I want to stick with jQuery only, I want the script to do most if not all of the animation work, where my part would only be to place the images and let the script do the rest.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •