0
(function($){
    $(window).load(function(){
        if(jQuery.isFunction(jQuery.fn.prettyPhoto)) {
            $.prettyPhoto.open(
                "images/ad1.jpg", // Image to be opened
                "title",    // Title of the pop-up
                "desc."     // The description
            );
            setTimeout(function() {
                $.prettyPhoto.close();
            }, 10000); // autoclose after 10 seconds
        } else {
            console.log("PrettyPhoto is not defined."); // log this message
        }
    });
})(jQuery);

I need some assistance with this. I am trying to make an image (ad1.jpg) link url to be opened in a new tab. How would I do this? I have tried many options to make this work. I might be placing the code wrong but I have tried window.open, and many more options. Any help is greatly appreciated. Thanks!

Kitsune
  • 19
  • 3
  • where in your code do you want to open a new tab? – jvecsei Aug 27 '14 at 20:24
  • This code is sitting in the footer in the index.html file. When the domain is launched the code displays the message correctly but need the image to when clicked open a URL in a new tab. – Kitsune Aug 27 '14 at 20:29
  • What behavior are you observing presently (does the link open in the same tab? does it not open anywhere?)? What is the relevant HTML? – 2540625 Aug 27 '14 at 20:38
  • image loads correctly, just need the image when clicked it links to a URL in another tab. – Kitsune Aug 27 '14 at 20:43

1 Answers1

0

Try this:

(function($){
    $(window).load(function(){
        if(jQuery.isFunction(jQuery.fn.prettyPhoto)) {
            $.prettyPhoto.open(
                "images/ad1.jpg", // Image to be opened
                "title",    // Title of the pop-up
                "desc."     // The description
            );
            $("#fullResImage").click(function() {
                window.open("url/goes/here");
            });
            setTimeout(function() {
                $.prettyPhoto.close();
            }, 10000); // autoclose after 10 seconds
        } else {
            console.log("PrettyPhoto is not defined."); // log this message
        }
    });
})(jQuery);

This assumes the image id of the displayed image is always fullResImage. I found that info at http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/documentation.

TW80000
  • 1,507
  • 1
  • 11
  • 18
  • if you look at the script the image loads fine, I need when you click on the image it opens a URL in a new tab – Kitsune Aug 27 '14 at 20:41
  • So something like `var img = document.getElementById("#theImage"); img.onclick = function() { window.open("the/url/here"); }` ? – TW80000 Aug 27 '14 at 20:43
  • within the script `$.prettyPhoto.open( "images/ad1.jpg", // Image to be opened "title", // Title of the pop-up "desc." // The description` works perfect, need the images/ad1.jpg to on click load a URL in another tab. – Kitsune Aug 27 '14 at 20:44
  • also with window.open I might had been placing it incorrectly in the script. could someone please place it in the script how it should be so I can try it? Thanks I'm pretty new to jquery – Kitsune Aug 27 '14 at 20:48
  • Ok, I see what you're saying now. You want the lightbox photo to show up, and when clicked on, opens up a new tab with a URL. Is that correct? – TW80000 Aug 27 '14 at 20:55
  • Ok. I'm not going to spend another hour reading documentation on how jquery and prettyphoto work, I only use vanilla javascript. All you need to look up is how to add an onclick event handler to the photo in the lightbox. You may also need a way of selecting the image in the lightbox to add the handler to. After that it should be easy. I hope you didn't know this all already, otherwise I was no help to you. Very sorry I couldn't help if that's the case. Best of luck! – TW80000 Aug 27 '14 at 21:22
  • I edited my OP. Try that out. – TW80000 Aug 27 '14 at 21:34
  • unfortunately that didnt work as well... – Kitsune Aug 28 '14 at 14:40
  • The last thing I would try is change the `.click(function(){...` to `.on("click", function({...`. If that doesn't work, I don't really know. Sorry. :/ – TW80000 Aug 28 '14 at 19:23