homepage Welcome to WebmasterWorld Guest from 54.211.231.221
register, free tools, login, search, subscribe, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor
Visit PubCon.com
Home / Forums Index / Code, Content, and Presentation / WordPress
Forum Library, Charter, Moderators: lorax & rogerd

WordPress Forum

    
Need a WP modal window plug-in
IntegrityWebDev




msg:4351171
 3:52 pm on Aug 13, 2011 (gmt 0)

I have a site for a festival and the entertainment page I want to have a link for [more info] for each act that when it is clicked opens a modal window with the content.

I've played with 2 or 3 modal windows but haven't found one yet that will do this seemingly simple task.

Any leads? I can write it myself if I dont find anything but I'd rather find a simple plugin for it as I'm crunched for time. Any help is appreciated!

Thanks!
Chris

 

lorax




msg:4351182
 4:49 pm on Aug 13, 2011 (gmt 0)

Where does the content live? Is it a Post or a content from a Calendar plugin?

IntegrityWebDev




msg:4351434
 7:53 pm on Aug 14, 2011 (gmt 0)

It would be a post plug in or something like that...the info would be bio info (paragraph with pic and website)

lexipixel




msg:4351522
 7:20 am on Aug 15, 2011 (gmt 0)

here's some scraps if you have to write it yourself..

This assumes you've got jQuery UI loaded.

There are (3) parts.
1). The jquery UI functions
2). the clickable link
3). the div with the content for the modal popup.

CAVEAT: you may need to wrestle with WP to keep it from modifying the HTML in the post when you save it.

1). add this inside a jQuery "document ready" function in the <head> tag of your template--


$("#moreInfo").click(function(event){ $( "#evInfoDialog" ).dialog( "open" ); return false; });

$("#evInfoDialog" ).dialog({
autoOpen: false,
width:600,
resizable: true,
show: "puff",
hide: "slide",
modal: true
});
(you can change options, size, "puff", "slide", etc to whatever you like)

2). Then add a div like this for the "more info" clickable link (wherever you want it to appear in the post) ---


<div id="moreInfo">more info</div>


3). Then put your additional info (text, images, links, whatever), in a div at the end of the post, or call the content dynamically if it comes from somewhere else. The option "autoOpen: false" (above, in step 1), should make it a hidden div.


<div id="#moInfo" title="Event Info">
<img align="right" src="/images/event.gif" style="margin:10px;">
<p>Here's some more info...</p>
</div>

IntegrityWebDev




msg:4351642
 3:41 pm on Aug 15, 2011 (gmt 0)

Thanks, I decided to just "roll my own"...using your jquery post help but modified for multiple windows to open on the page. Thanks for the help!

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / WordPress
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About
© Webmaster World 1996-2014 all rights reserved