Hello, I'm trying to make a picture pop up in a new window as a result of clicking a text link. The site I'm working on can be found at www.glovesanddoves.com. There's a link on the News page that says 'Shot Circuit' on the right in the middle. Currently if you click it you get a standard pop up displaying the image that doesn't look too good. I'd really like the jquery lightbox type of animated pop up that dims the page behind and centres it also. Any help or point in the right direction to the relevant tutorial would be appreciated. By the way, I'm not a coder and rely on Dreamweaver so I really do need an idiots guide by the numbers type approach.
Thanks
Jack
Ah, OK. Maybe a translation from geek to regular Joe?
Part 1 - Setup
That first block of code needs to be added between the <head> and </head> tags in the source. Then you need to put the files those links reference (jquery-1.7.2.min.js and lightbox.js) into a folder called "js" (no quotes) that sits in your site at the same level as the index.html page.
The lightbox.css link also goes between the <head></head> tags and the file lightbox.css goes in a folderr called "css" (no quotes) that will sit at the same level as your index.html page.
The remaining info about the images is asking you to go into the .css file to ensure that the links there, pointing to those 5 files, are pointing in the right place. If you have a folder called "images" already (again, on the same level as the index.html) go ahead and move the referenced images into it, otherwise, create the folder and add the images. If all of the folders are in the right spot, the links should look like this...
../images/prev.png and ../js/lightbox.js
Part 2 - Activate
This part is pretty literal, there isn't much I can say that will make it easier. You need to create a link with the URL going to your "big image". You can do that in DW by highlighting the text and adding the path to the image you want to display in the "Link" field of the Property Inspector. Once it has been added, you need to go into the source view and add that bit about rel="lightbox" as they show.
When all is said and done, you should preview in the browser to make sure it works. If it doesn't, you can upload your site to a test location and I can look for any errors for you.
Hello, It's times like these I wish I was that 'Geek' but I am as you say a regular Joe. I had done all of that already believe it or not but I've gone through it and moved some files around and still nothing? I'm really embarrasingly useless at this. I should stick to front end design but I'm forced to be a Jack of all trades seeing as it's just me.
Jack
Date: Thu, 13 Sep 2012 13:43:16 -0600
From: forums@adobe.com
Subject: Re: How do I make a jquery lightbox image pop up from text link? How do I make a jquery lightbox image pop up from text link?
Re: How do I make a jquery lightbox image pop up from text link?
created by Jon Fritz II in Dreamweaver - View the full discussion
Ah, OK. Maybe a translation from geek to regular Joe? Part 1 - Setup That first block of code needs to be added between the and tags in the source. Then you need to put the files those links reference (jquery-1.7.2.min.js and lightbox.js) into a folder called "js" (no quotes) that sits in your site at the same level as the index.html page. The lightbox.css link also goes between the tags and the file lightbox.css goes in a folderr called "css" (no quotes) that will sit at the same level as your index.html page. The remaining info about the images is asking you to go into the .css file to ensure that the links there, pointing to those 5 files, are pointing in the right place. If you have a folder called "images" already (again, on the same level as the index.html) go ahead and move the referenced images into it, otherwise, create the folder and add the images. If all of the folders are in the right spot, the links should look like this... ../images/prev.png and ../js/lightbox.js Part 2 - Activate This part is pretty literal, there isn't much I can say that will make it easier. You need to create a link with the URL going to your "big image". You can do that in DW by highlighting the text and adding the path to the image you want to display in the "Link" field of the Property Inspector. Once it has been added, you need to go into the source view and add that bit about rel="lightbox" as they show.
Replies to this message go to everyone subscribed to this thread, not directly to the person who posted the message. To post a reply, either reply to this email or visit the message page: Re: How do I make a jquery lightbox image pop up from text link?
To unsubscribe from this thread, please visit the message page at Re: How do I make a jquery lightbox image pop up from text link?. In the Actions box on the right, click the Stop Email Notifications link.
Start a new discussion in Dreamweaver by email or at Adobe Forums
For more information about maintaining your forum email notifications please go to http://forums.adobe.com/message/2936746#2936746.
Hello, The only way I can do it right now is to share the source files with you via drop box but I'll need an email address in order to invite you to share. The page I'm using is News_1.htm. The JS,CSS and images folders are in the HTML folder which is where the News_1.htm file is.
Jack
Date: Thu, 13 Sep 2012 14:19:41 -0600
From: forums@adobe.com
Subject: Re: How do I make a jquery lightbox image pop up from text link? How do I make a jquery lightbox image pop up from text link?
Re: How do I make a jquery lightbox image pop up from text link?
created by Jon Fritz II in Dreamweaver - View the full discussion
It's likely something very small. If you could post a link to what you have, I'm sure we could find the issue pretty quickly.
Replies to this message go to everyone subscribed to this thread, not directly to the person who posted the message. To post a reply, either reply to this email or visit the message page: Re: How do I make a jquery lightbox image pop up from text link?
To unsubscribe from this thread, please visit the message page at Re: How do I make a jquery lightbox image pop up from text link?. In the Actions box on the right, click the Stop Email Notifications link.
Start a new discussion in Dreamweaver by email or at Adobe Forums
For more information about maintaining your forum email notifications please go to http://forums.adobe.com/message/2936746#2936746.
Hello, The only way I can do it right now is to share the source files with you via drop box but I'll need an email address in order to invite you to share. The page I'm using is News_1.htm. The JS,CSS and images folders are in the HTML folder which is where the News_1.htm file is. The text link that I would like to use to open the new lightbox window is on the right of the page in the middle called 'Shot Circuit.' The text link has the Shot Circuit Poster jpeg image set as a link already. The JPEG image is in the Images folder on the same level as the HTML folder. Hope that helps.Jack
Date: Thu, 13 Sep 2012 14:19:41 -0600
From: forums@adobe.com
Subject: Re: How do I make a jquery lightbox image pop up from text link? How do I make a jquery lightbox image pop up from text link?
Re: How do I make a jquery lightbox image pop up from text link?
created by Jon Fritz II in Dreamweaver - View the full discussion
It's likely something very small. If you could post a link to what you have, I'm sure we could find the issue pretty quickly.
Replies to this message go to everyone subscribed to this thread, not directly to the person who posted the message. To post a reply, either reply to this email or visit the message page: Re: How do I make a jquery lightbox image pop up from text link?
To unsubscribe from this thread, please visit the message page at Re: How do I make a jquery lightbox image pop up from text link?. In the Actions box on the right, click the Stop Email Notifications link.
Start a new discussion in Dreamweaver by email or at Adobe Forums
For more information about maintaining your forum email notifications please go to http://forums.adobe.com/message/2936746#2936746.
For quick answers to layout questions, get some free, temporary hosting for testing and debugging purposes. Many ISPs offer a free web space you could use. Or look at this site:
Upload your page and support files to your web server space and post your URL in the web forum.
I for one don't have time to download people's work files and reconstruct the site in DW. I have my own projects to work on. If you provide a link we can see in our browsers, it takes 1 minute to check your site and come back with a solution. ![]()
Nancy O.
Quadzilla_1111 wrote:
Hello, The only way I can do it right now is to share the source files with you via drop box but I'll need an email address in order to invite you to share. The page I'm using is News_1.htm. The JS,CSS and images folders are in the HTML folder which is where the News_1.htm file is. The text link that I would like to use to open the new lightbox window is on the right of the page in the middle called 'Shot Circuit.' The text link has the Shot Circuit Poster jpeg image set as a link already. The JPEG image is in the Images folder on the same level as the HTML folder. Hope that helps.Jack
I have to agree with Nancy here. If you have access to the FTP for your site, you could create a folder called "test" that you can upload your files to on your domain at www.glovesanddoves.com.
The link would then end up being www.glovesanddoves.com/test/News_1.htm
It won't take much to find your issue, so you can delete the folder before any search bots find it.
Hello, You were right. It was the smallest thing imagineable. I forgot an equals sign. This is why I could not be a coder. My memory for all that syntax is terrible. Thanks so much for the link to the site by the way and your patience with me. Got there in the end.
Jack
Date: Thu, 13 Sep 2012 15:07:40 -0600
From: forums@adobe.com
Subject: Re: How do I make a jquery lightbox image pop up from text link? How do I make a jquery lightbox image pop up from text link?
Re: How do I make a jquery lightbox image pop up from text link?
created by Jon Fritz II in Dreamweaver - View the full discussion
Quadzilla_1111 wrote: Hello, The only way I can do it right now is to share the source files with you via drop box but I'll need an email address in order to invite you to share. The page I'm using is News_1.htm. The JS,CSS and images folders are in the HTML folder which is where the News_1.htm file is. The text link that I would like to use to open the new lightbox window is on the right of the page in the middle called 'Shot Circuit.' The text link has the Shot Circuit Poster jpeg image set as a link already. The JPEG image is in the Images folder on the same level as the HTML folder. Hope that helps.Jack I have to agree with Nancy here. If you have access to the FTP for your site, you could create a folder called "test" that you can upload your files to on your domain at www.glovesanddoves.com. The link would then end up being www.glovesanddoves.com/test/News_1.htm It won't take much to find your issue, so you can delete the folder before any search bots find it.
Replies to this message go to everyone subscribed to this thread, not directly to the person who posted the message. To post a reply, either reply to this email or visit the message page: Re: How do I make a jquery lightbox image pop up from text link?
To unsubscribe from this thread, please visit the message page at Re: How do I make a jquery lightbox image pop up from text link?. In the Actions box on the right, click the Stop Email Notifications link.
Start a new discussion in Dreamweaver by email or at Adobe Forums
For more information about maintaining your forum email notifications please go to http://forums.adobe.com/message/2936746#2936746.
North America
Europe, Middle East and Africa
Asia Pacific