Create a popup contact page.

Summary:

In a lightbox...?

Create a popup contact page.

wstone 12 Sep 2009 20:24

On one of my wikis, visitors are able to contact the author of a page via a MailForm. Currently this is in a collapsible section at the bottom of the page. What I'd prefer, is to have this "popup" when the reader clicks a "Contact" link. For example, in a lightbox like the gallery module.
Can this be done?
Any ideas welcome.

Cheers.
tDM.

---

FlamePad.com

Re: Create a popup contact page.

Ed Johnson 12 Sep 2009 22:35

Doesn't the popup technique James has been working on for the calendar project support Wikidot syntax inside the popup? If it does, that might work for you.

-Ed

---

Free Wikidot Applications · Your Shared Photo Gallery · Your Personal Blog

Re: Create a popup contact page.

wstone 13 Sep 2009 11:31

I'll look into it, thanks.

---

FlamePad.com

Re: Create a popup contact page.

wstone 13 Sep 2009 23:11

I had a look around on the site and just can't seem to find the popup mechanism you mentioned. Can you post a link/tutorial of how it is done. Thanks.

---

FlamePad.com

Re: Create a popup contact page.

Ed Johnson 14 Sep 2009 01:16

I was thinking of this:
How to make MouseOver-Popup

As a "proof of concept", I created this page:
Mailform Popup Test

This would work better if the popup can be made "sticky" (something we might have if we get my wish for overLIB support <fingers crossed>). The problem is that the popup closes if the mouse leaves the form.

I had to tweak the CSS from the howto a bit to make it play nice with a mailform:

#page-content  p,
#page-content .popup {
    display:inline;
}
 
.popup{
    position: relative;
    color: #34B;
}
 
.popup:hover .popupitem {
    display: block;
}
 
.popupitem{
/*    background: transparent url("/local--files/cssimages/popupindicator.gif") no-repeat top; */
    position: absolute;
    top: 0;
    left: 0;
/* width: 200px; */
    min-width: 200px;
    height: auto;
    display: none;
    z-index: 1;
}
 
.popup-container {
    margin-top: 25px;
    border: 2px solid #2F3BAF;
    background-color: #FFF;
    padding: 20px 5px;
    height: 100%;
}

---

Free Wikidot Applications · Your Shared Photo Gallery · Your Personal Blog

Re: Create a popup contact page.

Ed Johnson 14 Sep 2009 01:24

After playing with this, I don't recommend trying to use it. It's a great example of something that is possible but pretty unusable (at least the way I threw it together). Feel free to send me a few test messages to see how funky it behaves.

-Ed

---

Free Wikidot Applications · Your Shared Photo Gallery · Your Personal Blog