SitePoint Sponsor

User Tag List

Results 1 to 6 of 6

Hybrid View

  1. #1
    SitePoint Member
    Join Date
    Jun 2011
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    How to animate two photos

    Hi,
    I am new to this forum and also javascript.
    I am trying to create a flashing signal affect on a car. Basically one picture has signal off and second picture signal on. I achieved this with GIF animation and used 256 colors but picture quality suffered dramatically. I also don't want to use flash.
    Here is the result with GIF: Your Site Name

    Can someone please point me to a javascript code to achieve this or maybe write one up.

    Please let me know if you need more info.

    Thanks in advanced.

  2. #2
    SitePoint Guru
    Join Date
    Sep 2006
    Posts
    731
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Code:
    <img src = 'mypic.gif' id = 'somePic'>
    
    <script type="text/javascript">
    
    function twoPix( picId, picA, picB, period )
    {
      var picElem = document.getElementById( picId ), state = false;   
        
      function f()
      {
        picElem.src = ( state ^= true )  ? picB : picA ;
      }
      
      setInterval( f, period );
    }
    
    twoPix( 'somePic', 'mypic.gif', 'myotherpic.gif', 500 );
    
    </script>
    Thanks in advanced
    Whatever that means.
    Tab-indentation is a crime against humanity.

  3. #3
    SitePoint Member
    Join Date
    Jun 2011
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks Ali, I will give this a shot shortly and let you know the result.

  4. #4
    SitePoint Member
    Join Date
    Jun 2011
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ali, it works when the pictures are in the same folder as the html document.
    How can you make it work if pictures are in a sub-folder.
    Thanks for your help! I appreciate this.

  5. #5
    SitePoint Guru
    Join Date
    Sep 2006
    Posts
    731
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by sakanet View Post
    Ali, it works when the pictures are in the same folder as the html document.
    How can you make it work if pictures are in a sub-folder.
    Thanks for your help! I appreciate this.
    Specify the relative path as part of the file names.
    Tab-indentation is a crime against humanity.

  6. #6
    SitePoint Member
    Join Date
    Jun 2011
    Posts
    4
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ali thanks, i forgot to tell you that it worked. I had to use a module to make it work in a Joomla site since Joomla was modifying the code.
    Thanks again!


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
  •