Triggering FancyBox from a DIV onclick();

Posted by Tim on Stack Overflow See other posts from Stack Overflow or by Tim
Published on 2010-03-18T00:07:00Z Indexed on 2010/03/18 0:11 UTC
Read the original article Hit count: 1174

Filed under:

fancybox

|

div

|

onclick

|

jQuery

|

lightbox

Hello,

This question seems to be asked a lot, but I haven't seen an answer that works.

So I have a div that works like this:

<div onclick="location.href='http://www.abc123.com';" class="menuitem">
</div>

Now I need the link (specified in location.href) to open up in a fancybox iframe.

I would love to use an A element but this div holds other items so I don't think I can.

I am open to all suggestions... even using elements other than divs, or using a different jquery iframe lightbox.

Thanks

Tim Mohr

© Stack Overflow or respective owner

Related posts about fancybox

Fancybox, getting Fancybox to bind using LIVE() to items being loaded onto the page after load

as seen on Stack Overflow - Search for 'Stack Overflow'
I have a page that loads and after it loads, it pulls in a list of LIs to populate a news feed. quick view quick view quick view I'm trying to get fancy box to trigger when a user clicks on quick view but haven't had any luck. Any Ideas? $(document).ready(function() { $('.quickview').fancybox(); }); also… >>> More
fancybox: finding anchor from which fancybox was called

as seen on Stack Overflow - Search for 'Stack Overflow'
Inside fancybox window I would like to retrieve html element (anchor probably) from which fancybox was called. How can this be done? >>> More
Fancybox close button not showing when using different template

as seen on Stack Overflow - Search for 'Stack Overflow'
I have a page where I need to use 2 different FancyBox styles for different elements on the page. To achieve that, I added tpl option and modified stylesheet accordingly. Here is what I have: $(document).ready(function() { $(".login").fancybox({ closeClick : false, closeBtn : true, … >>> More
Fancybox troubles

as seen on Stack Overflow - Search for 'Stack Overflow'
Hello all, I am trying to implement a fancybox. http://fancybox.net/howto I want to call this function on an an element. Full JS file. http://fancybox.net/js/fancybox/jquery.fancybox-1.2.1.js $.fn.fancybox = function(settings) { I have done this: $(document).ready(function() { $("a#inline")… >>> More
FancyBox resize width

as seen on Stack Overflow - Search for 'Stack Overflow'
I'm able to resize the height with the $.fancybox.resize(); part, but the width just doesn't update according to the new content. Thoughts? >>> More

Related posts about div

add a div.class in a child, only when the parent does not have other div.class

as seen on Stack Overflow - Search for 'Stack Overflow'
i have a html code like this: <div class="someclass"> <div class="childclass"></div> <div class="checkclass"></div> </div> <div class="someclass"> <div class="childclass"></div> </div> <div class="someclass"> <div… >>> More
#div:normal #div:hover #div:SELECTED?

as seen on Stack Overflow - Search for 'Stack Overflow'
Hey guys, On the "services" and "company" pages I have a right sidebar list. This is being included with PHP. So far I have a CSS class for normal and a CSS class for when you hover each item in the list. I want to have a new class for when each list item is selected. So for example in services,… >>> More
DIV Overlaying DIV, links in backmost DIV non-accessible

as seen on Stack Overflow - Search for 'Stack Overflow'
I have a photoshop image that is 500x600 that I am using as a background image for the first div. The second div sits over top of the first div and is populated with images. The z-index of the first div is set to 100. The effect is the photoshop image sits over top of all of the smaller images. The… >>> More
Two DIV layers: resize top DIV based on dynamic height of bottom DIV

as seen on Stack Overflow - Search for 'Stack Overflow'
I have two DIV layers, one above the other. In the top DIV, there is an image, and in the bottom DIV, there is a block of text. The amount of text in the bottom DIV will change, thus increasing and decreasing the required height. I need to dynamically decrease the height of the image in the top DIV… >>> More
Why won't my DIV height grow? Is it because I am using floats?

as seen on Stack Overflow - Search for 'Stack Overflow'
Please help! I am trying to create some div sections and some of these div sections have some other divs that are floated. All of which I have cleared. But the sections are not growing to accomodate the content inside of them. The following is my HTML - <div class="data"> <div class="name">Data</div> … >>> More