www.webdeveloper.com
Results 1 to 2 of 2

Thread: 2 nubie questions

  1. #1
    Join Date
    Jul 2011
    Posts
    14

    2 nubie questions

    I have a img element that looks like this:
    <img id="button" src="images/playBtn.png" />

    when I click on it it toggles a play/pause button. The button changes as it should but the slideshow doesn't turn off when I click pause.

    the code to handle the element:
    Code:

    var auto = document.getElementById("button");
    // alert(auto.src);

    auto.onclick = function() {
    if(auto.src == "file:///C:/jimslounge.com/jsClass/lab6.1/images/playBtn.png") {
    auto.src="images/pauseBtn.png";
    var showOn = window.setInterval("loadNextPic()", 5000);
    }else{
    auto.src="images/playBtn.png";
    clearInterval(showOn);
    }
    }

    I noticed when I did an alert on auto src it displays the full path. It only works with the full path I want to only have to test for "images/playBtn.png".
    Another problem I have is in the else part the image changes like it should but the clearInterval(showOn); doesn't seem to do anything I thought it would pause the slideshow.
    Last edited by attaboy; 07-17-2011 at 01:30 PM.

  2. #2
    Join Date
    May 2011
    Posts
    194

    compare .src, relative path etc.

    Hi,


    compare .src only with .src

    f.e.
    var auto1 = document.getElementById("button1");
    var auto2 = document.getElementById("button2");

    auto1.src="images/pauseBtn1.png";
    auto2.src="images/pauseBtn2.png";

    if(auto1.src==auto2.src) ....


    ----------------------

    create a dummy object to create src

    var ptImgObj=document.createElement('IMG');
    var ImgObjExist=(ptImgObj!=null);
    if(ImgObjExist)
    {
    var ptImg=document.body.appendChild(ptImgObj);
    ImgObjExist=(ptImg!=null);
    }
    if(ImgObjExist)
    {
    ptImg.style.visibility='hidden';
    ptImg.src="";

    }


    function getSRC(filename)
    {
    if(ImgObjExist)
    {ptImg.src=filename;}
    else{ptImg.src="";} // try - catch for error catch during set .src

    return ptImg.src;
    }

    var auto1 = document.getElementById("button1");
    auto1.src="images/pauseBtn1.png";

    if(auto1.src==getSRC("images/pauseBtn2.png")) ....

    // if many pointer and filename use arrays for store so
    // document.getElementById("") one time needed

    ------------------------------

    window.setInterval("loadNextPic()", 5000);

    var timerId=setInterval(...);

    .....

    clearInterval(timerId);


    var timerID=0;

    auto.onclick = function()
    {
    if(auto.src == "file:///C:/jimslounge.com/jsClass/lab6.1/images/playBtn.png")
    {
    auto.src="images/pauseBtn.png";
    timerID = window.setInterval("loadNextPic()", 5000);
    // not local to function
    }
    else
    {
    auto.src="images/playBtn.png";
    clearInterval(timerID); // global timerID
    }
    }

    --------------------------------

    On webserver a url is relative to root f.e. to www.test.com

    so http://www.test.com/path/ .... only if webpage online

    so folder ob webpage local on harddisk
    in subfolder exist f.e. pictures
    so usee path like ../ etc.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles