Hi Stella,
Lightbox2 is super-neat, but today my brain is feeling like pudding and I can't figure out how to do this simple task:

I have a block (in this particular case it's the Ubercart shopping cart block) that I'd like to display in a modal window. I've looked at the various handbook pages and I have successfully loaded up an *entire* webpage using rel="lightmodal" but I have not figured out how to load up just a single div. (I am figuring I'll output my block into some particular div, then use lightbox to display that div.)

All of the documentation is about loading up a whole page and I am confused. Where should I point my href?

Can you please give me a simple recipe or point me to a page that I can copy/dissect?

Thanks!

Comments

stella’s picture

stella commented
Status: Active » Fixed

Maybe try:

<a href="example.html #divname > *" rel="lightmodal">click here</a>

Haven't tested it, but I think it should work - you can use jquery selectors in the href for lightbox to use.

Cheers,
Stella

leenwebb’s picture

leenwebb commented

Hmmmm... almost there! This is what I have:

print '<a href="'.request_uri().' #cart" rel="lightmodal">view cart</a>';

print '<div id="cart">This is the shopping cart code</div>';

It's lovely! Except that the div displays on the main page as well as the modal. If I put in style="display:none;" for the div, then when I click the link the modal window also displays with nothing in it.

Is there a way to change the display style of the div as I call it? Or is there a different way to go about this?

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.

kvvnn’s picture

kvvnn commented

#2 worked great for me for a custom views block. The following was my process

1) create a View with a Block display
2) enable the Block on all pages in content-bottom (region is not important)
3) used css to hide the Block (example below)
4) created a menu link with #2 (not including the shopping cart div. you need to use PHP input)

Example css to hide the Block on all pages, but show it in the lightbox window :

#content-bottom #block-views-credits-block_1 {
	display: none;
	}