#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2013
    Posts
    8
    Rep Power
    0

    Call a function without an event


    I trying to use a function which, change image src. The function is activated by using the onMouseOver(). I want to activate the function without the use of any event.

    Code:
    <div class = 'cls'   onMouseOver='changeImage();'>
    changeImage change the src of image tag constantly so the use of the onload is not what i am looking for. Any ideas?
  2. #2
  3. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2013
    Posts
    5
    Rep Power
    0
    you can do this using onmouseover

    HTML
    Code:
    <div class="cls" onmouseover="runFun()"></div><br/><br/>
    <img id="img" src="1.png" />
    JAVASCRIPT
    Code:
    var img = ['1.png','2.png','3.png'];
    var i =1;
    
    function runFun()
    {
        if(i==3)
        {
            i = 0;
        }    
        document.getElementById("img").src= img[i];
        i = i+ 1;
    }

    Comments on this post

    • Zenitis Stoich agrees
  4. #3
  5. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2013
    Posts
    8
    Rep Power
    0
    ChangeImage basically changes img tag url constantly. So i want to change my image in img tag without doing anything.

    Code:
    function changeImage() {
    document.getElementById("img").src=obj.usersCloud.profileImages[0];//obj.usersCloud.profileImages[0] changes every second
    }
    html code

    Code:
     
    <div  onMouseOver='changeImage();'>
    <img id = "img" class = "images" src = 'img.jpg' >
    </div>
    When the mouse is over the dom it change the image. I want to do so without the use of any event.
  6. #4
  7. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2013
    Posts
    5
    Rep Power
    0
    what do you mean by without any event ?

    and you basically mean when user hover over your div image tag ,src changes in evry few seconds. that is what you want ?

    like mini slider [Facebook album Effect]
  8. #5
  9. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2013
    Posts
    8
    Rep Power
    0
    ChangeImage changes every 1second url. I want every time that my function changes image, this change to be displayed in img tag without any hover or click or mouseover.
  10. #6
  11. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2013
    Posts
    5
    Rep Power
    0
    may be you are looking for setInterval()

    Code:
    var img = ['1.png','2.png','3.png'];
    var i =1;
    
    setInterval(function(){
      if(i==3)
          {
              i = 0;
          }    
          document.getElementById("img").src= img[i];
          i = i+ 1;
    },1000);
    this will change image in every 1s .
  12. #7
  13. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2013
    Posts
    8
    Rep Power
    0
    My function works fine. Actually changes the image url. My problem is not how to refresh url. My problem is how to change the image in img tag without onclick or another event, but automatically.
  14. #8
  15. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2013
    Posts
    5
    Rep Power
    0
    can you please post your code.
    or make fiddle on fiddle[dot]net

    setInterval() actually does what you really want.
  16. #9
  17. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2013
    Posts
    5
    Rep Power
    0
    Check this fiddle

    jsfiddle[dot]net/tKzHY/2
  18. #10
  19. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2013
    Posts
    8
    Rep Power
    0
    Ok done it, with intervals. Thanks!!

IMN logo majestic logo threadwatch logo seochat tools logo