#1
  1. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2002
    Location
    Colorado
    Posts
    4
    Rep Power
    0

    Question How do I add links to my Javascript Photo Album?


    Hello Everybody!

    I have a javascript photo album at this address:

    http://www.profession-l.com/portfolio.asp

    I would like to be able to have a different link for each picture in the album.

    Any input would be greatly appreciated.

    Thanks

    ~Tag
  2. #2
  3. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Nov 2001
    Posts
    765
    Rep Power
    14
    I'd consider re-doing the whole thing along more object-oriented lines - but this might get you by:

    var picURLS = new Array(); //for demo
    picURLS[0] = 'javascript:alert("URL 0")';
    picURLS[1] = 'javascript:alert("URL 1")';
    picURLS[2] = 'javascript:alert("URL 2")';
    picURLS[3] = 'javascript:alert("URL 3")';
    picURLS[15] = 'javascript:alert("URL 15")';
    picURLS[14] = 'javascript:alert("URL 14")';
    picURLS[13] = 'javascript:alert("URL 13")';


    function back(name) {
    if (browserOK) {
    pics[name]["pos"]--;
    if (pics[name]["pos"]<0) pics[name]["pos"]= pics[name]["count"]-1;
    document.images[name].src= pics[name][pics[name]["pos"]].src;
    document.images[name].onmousedown = function() {
    this.clicked = true;
    }
    document.images[name].onmouseup = function() {
    if (this.clicked) location = picURLS[pics['pic1']["pos"]];
    }
    }
    }

    function forward(name) {
    if (browserOK) {
    pics[name]["pos"]++;
    if (pics[name]["pos"]>=pics[name]["count"]) pics[name]["pos"]= 0;
    document.images[name].src= pics[name][pics[name]["pos"]].src;
    document.images[name].onmousedown = function() {
    this.clicked = true;
    }
    document.images[name].onmouseup = function() {
    if (this.clicked) location = picURLS[pics['pic1']["pos"]];
    }
    }
    }

    // preload images
    .......................

    onload = function() {
    document['pic1'].onmousedown = function() {
    this.clicked = true;
    }
    document['pic1'].onmouseup = function() {
    if (this.clicked) location = picURLS[pics['pic1']["pos"]];
    }
    }
    // -->

    </script>
    </head>

    [tested:IE5.5,6,NS4,6]
  4. #3
  5. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2002
    Location
    Colorado
    Posts
    4
    Rep Power
    0

    Almost there!


    Thanks for your help MrRichardFeder.

    Your Code definately put me in the right direction!

    (http://www.profession-l.com/portfolio.asp)

    But what I am trying to accomplish is an actual link to the site when you click on the image.

    I am so very close!!!

    Amy Ideas???
  6. #4
  7. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Nov 2001
    Posts
    765
    Rep Power
    14
    hey Tag..

    Just replace the

    'javascript:alert("URL 0")';

    ...with an actual URL (in quotes)!

    Notice the image onclick in Netscape 4 - only available in JavaScript. If you want a hand cursor, add this to the image tag:

    <center><p><img src="images/portfolio/pawnee.jpg" alt="" border="0" name="pic1" style="cursor:hand;">

    That might be 'pointer' in Moz; I'm too tired to remember.

    cheers...
  8. #5
  9. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2002
    Location
    Colorado
    Posts
    4
    Rep Power
    0

    Cool Nice Job!


    Thank You So Much!

    Your code has worked!

    There is one last and final thing I have to ask...

    Is there a way to get the linked site to open in a new window?

    That would be the icing on the cake!

    Thanks so much again for your help!

    ~Tag
  10. #6
  11. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Nov 2001
    Posts
    765
    Rep Power
    14
    Tag -

    Off to bed (zzzz).

    Find a good pop-up script (google.com) and just plug that URL in there:

    if (this.clicked) openPopUp(picURLS[pics['pic1']["pos"]]);
  12. #7
  13. No Profile Picture
    Junior Member
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2002
    Location
    Colorado
    Posts
    4
    Rep Power
    0

    Thumbs up It all works!


    MrRichardFeder -

    I cannot thank you enough!

    With a little determination and your help, I have achieved my goal!

    Here is the link again in case you wanted to see the finished product:

    http://www.profession-l.com/portfolio.asp

    Thanks again for all of your help!

    I really appreciate it!

    ~Tag
  14. #8
  15. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Nov 2001
    Posts
    765
    Rep Power
    14
    ~Tag...

    Hey, you're welcome. Pasted in a pop-up script I dug out from the archives. Help yourself; play with the numbers if you like. It's optimized for an 800x600 display, but can be altered easily. Hope it's of use.

    cya
    Attached Files

IMN logo majestic logo threadwatch logo seochat tools logo