Image Rotation

Collapse
X
 
  • Time
  • Show
Clear All
new posts
  • ashsa
    New Member
    • Feb 2007
    • 45

    Image Rotation

    Hi everyone,

    Is there a way to rotate an image to a certain degree using javascript ??
    My Idea is to rotate clockwise or anti clockwise an image based on the mouse coordinates..

    And to make it cool by changing the image dynamically loaded from a folder..

    Many Thanks..
  • dmjpro
    Top Contributor
    • Jan 2007
    • 2476

    #2
    Originally posted by ashsa
    Hi everyone,

    Is there a way to rotate an image to a certain degree using javascript ??
    My Idea is to rotate clockwise or anti clockwise an image based on the mouse coordinates..

    And to make it cool by changing the image dynamically loaded from a folder..

    Many Thanks..
    Good Idea.
    This is totally mathematical based calculation.
    Here it requires more Math knowledge rather than JS knowledge.
    Ok.
    So post your code experts are here to solve your problem.

    Kind regards,
    Dmjpro.

    Comment

    • ashsa
      New Member
      • Feb 2007
      • 45

      #3
      Originally posted by dmjpro
      Good Idea.
      This is totally mathematical based calculation.
      Here it requires more Math knowledge rather than JS knowledge.
      Ok.
      So post your code experts are here to solve your problem.

      Kind regards,
      Dmjpro.
      I jus started off with the idea and din find a convenient way of doing this .. Googling on this for a long time .. I thought there might be a javascript function that can serve the purpose.. As you said, it indeed requires a lot of Trig n I would love it .. But dont have the basic idea how to rotate the image on a div with z-index set to 1..

      Any Idea would be appreciated.. Leaving Office now .. Jus thought not to disappoint you when you dont get further reply from me for today ..
      Catch ya tomorro ..

      Comment

      • ashsa
        New Member
        • Feb 2007
        • 45

        #4
        Originally posted by ashsa
        I jus started off with the idea and din find a convenient way of doing this .. Googling on this for a long time .. I thought there might be a javascript function that can serve the purpose.. As you said, it indeed requires a lot of Trig n I would love it .. But dont have the basic idea how to rotate the image on a div with z-index set to 1..

        Any Idea would be appreciated.. Leaving Office now .. Jus thought not to disappoint you when you dont get further reply from me for today ..
        Catch ya tomorro ..
        Rotation as in Spin (clock wise or anti clockwise)..
        Cos when i give rotation, all google results pointed to links for displaying a series of images ( banner rotation )

        Comment

        • dmjpro
          Top Contributor
          • Jan 2007
          • 2476

          #5
          Originally posted by ashsa
          Rotation as in Spin (clock wise or anti clockwise)..
          Cos when i give rotation, all google results pointed to links for displaying a series of images ( banner rotation )
          Hi Asha.
          This is not CHAT ROOM.
          I think you all time you do chatting with your friends.
          But it's a forum.
          Whenever you do some post then please read the guidelines mentioned just at the right end.
          OK.

          Anyway I am trying to give some hints which may help you to do it.
          In Java Script you know how to place a HTML element at absolute or relative position?
          I think you know.
          So first calculate your mathematical operations means the position of image when you are rotating the image at certain angle.
          You know co-ordinate geometry that's here the geometry comes in.
          You first try some code then come here, experts are here to solve your problem.

          And remember one thing don't use code word here because it's FORUM dear.
          Anyway best of luck with your try.

          Kind regards,
          Dmjpro.

          Comment

          • gits
            Recognized Expert Moderator Expert
            • May 2007
            • 5390

            #6
            hi ...

            i think it might be possible with css ... for IE the following link may be of help ...

            kind regards

            Comment

            • acoder
              Recognized Expert MVP
              • Nov 2006
              • 16032

              #7
              Originally posted by ashsa
              Rotation as in Spin (clock wise or anti clockwise)..
              Cos when i give rotation, all google results pointed to links for displaying a series of images ( banner rotation )
              Try Google search for "javascript rotate image"

              Comment

              • dmjpro
                Top Contributor
                • Jan 2007
                • 2476

                #8
                Originally posted by gits
                hi ...

                i think it might be possible with css ... for IE the following link may be of help ...

                kind regards
                Thanks Gits.....Thanks for your suggestion.
                But is this possible for all browser?


                I think I better to do it with Java Script.
                And also your brain will be simply teased.

                Anyway thanks again for your suggestion.

                Kind regards,
                Dmjpro.

                Comment

                • gits
                  Recognized Expert Moderator Expert
                  • May 2007
                  • 5390

                  #9
                  as far as i know there is only this possibility with IE-style-filters ... because there is no way to rotate an image physicly with js ... only css may help with that ... and i don't know whether there is any common css for that?

                  kind regards

                  Comment

                  • dmjpro
                    Top Contributor
                    • Jan 2007
                    • 2476

                    #10
                    Originally posted by gits
                    as far as i know there is only this possibility with IE-style-filters ... because there is no way to rotate an image physicly with js ... only css may help with that ... and i don't know whether there is any common css for that?

                    kind regards
                    Ok GITS.
                    But it would be better if you have a look at the link provided by ACODER.

                    Kind regards,
                    Dmjpro.

                    Comment

                    • gits
                      Recognized Expert Moderator Expert
                      • May 2007
                      • 5390

                      #11
                      of course ;) ... please post here again in case you find a solution that works ...

                      kind regards

                      Comment

                      • gits
                        Recognized Expert Moderator Expert
                        • May 2007
                        • 5390

                        #12
                        mmmhm ... and now after i thought it over it is possible of course ... we may match the mousecoords (probably an inerval of it) with an prepared imagesource and we set the src-attribute accordingly ;) may be i do something like that at the weekend ... would be interesting to try it out ... and have a look at the effect ;)

                        kind regards

                        Comment

                        Working...