How can I make this lightbox effect that they use on this website http://www.usatoday.com that when you click on a thumbnail the page loads in with that lightbox pop-over the content effect.
But the thing is it's not just a simple lightbox plugin because the link changes into the post link in the address bar.
I've looked around and all I could find are these: http://www.jacklmoore.com/colorbox/ and http://fancybox.net/
but they are not really what I am looking for, since I really need the link to change in the address bar.
If anybody knows of a simple way to achieve this, please help me out :)
Thanks
This may be helpful for creating light box using jquery.
http://www.tonylea.com/2011/how-to-create-your-own-jquery-lightbox/
Related
i am using the "Photo Swipe Masonry" plugin (version 1.0.6) on wordpress 4.3.1.
It works perfect so far.
But, i have some images which have a custom link to an external url(instead of the stadard to the image). If i click one of these images, it opens the url in a new window. That works like expected.
Now, when i click on an standard image(no external url), the lightbox opens and the image is displayed like expected.
But now, when i use the prev/next buttons to navigate through the images and i reach an image with a custom link, i got the errormessage:
"The image could not be loaded" (in the lightbox).
So, my question is, how to exclude images from being added to the lightbox?
Maybe by a unique class ?
Any help is highly appreciated.
Many thanks in advance to all of you for your time.
Regards,
Joe
I'm the developer of this plugin. Sorry for missing this post. There is no function built in for this sorry. You would need to edit the photoswipe code.
I do apologize for the title if it is inaccurate. (feel free to offer me suggestions on the proper wording if needed.)
My question is for my web page, I would like to do something where you click on a link (or image), and instead of opening a new tab or browser window, you get a box that hovers over your page displaying the image of the link (or smaller image you clicked on). I am not sure if the correct term for this is a pop-up or pop-over window.
The best example of what I would like to do, is if you were to go to amazon.com and you see a product and it says "click here for a larger image". when you do that, a sort of window will display itself over the current page and show you the larger image.
Would anyone be able to give an example of code to see how this would be done as well? I am very thankful for any and all recommendations.
You could use a solution like fancybox, I believe this is what are you looking for http://fancybox.net
If I've understood what you mean, there are tons of jquery plugins to do that, for example http://lokeshdhakar.com/projects/lightbox2/
Here is a link, he has an explanation and code snippets for ya, works great.
http://www.htmlgoodies.com/beyond/javascript/article.php/3881276
Here is my question,
Can I place a script or a code of some sort next to an image to make it pop out in a lightbox, without messing with the css? Just a simple single image that when clicked on just pops out in a lightbox.
Sort of like this:
<img src="image">
But instead of ref to a url, I would like to make a full screen lightbox pop out. So the user doesn't have to click back or open another tab.
Any help is highly appreciated.
Yes you can, I like Fancybox as an versatile jQuery tool with many functions and options. See here for examples.
I have creating a page where i need to show a div in a popup. I have searched around and only found window.open, that i personally hate, as its a really ugly solution, and causes crosss browser broblems. I have seen floating popups on the web, with a black cross in the right upper hand corner. I think you must create a div, and the JS script will pick up .the div and show it in the floating window. I have searched around alot but could not find a solution. I using Tapestry 5.3.6 . Can anyone show me how to do this..?
From your description it sounds as though you might be looking for FancyBox:
http://fancybox.net/
There are a lot of tutorials on how to use these JavaScript based overlay type pop-up windows. The FancyBox homepage shows quite a few examples.
There are lots of javascript solutions for this.
Start by looking at
Jquery UI
What you want is called a modal window or dialog
Thickbox
Colorbox
Jquery Light Box
Try this jquery lightbox plugin i think this is what you want...Hope it helps...
I'm stuck in a problem that on first glance seems simple, but actually it's a bit hard to fix. I have a share button on my colorbox and when a user clicks it I want to open a pop-up with the social media link. Now I tried a few simple pop-ups but a lot of the blockers are disabling them and it's not an option to force the users to disable their software.
Can anyone offer suggestions?
You can try to replace your popup with iframe integrated into your page. Place it to the center of the page, hide it initially. And on user click set iframe's src to the url which you open in popup now and show iframe.
Off the top of my head, I'd suggest some sort of modal, jqModal is pretty popular and my preferred way of doing things. Do you have any code that you could share?