views:

62

answers:

1

erm...hi first, i wanna ask how to i change a facebook-style lightbox content with a textarea?

i don't know how to exaplain,but i think the images below will say what i want

http://img163.imageshack.us/img163/6248/93306989.jpg

i'm using Facebox to do the pop up content,so how can i make the pop up content dynamic?

Example: Edit the textarea,click the Example,facebox pop up.

here the link to famspam.com/facebox/

Facebox is a jQuery-based, Facebook-style lightbox which can display images, divs, or entire remote pages.

and here is my code

<textarea class="expand" rows="" cols="">
<html>
<body>

 <h1> Heading</h1>

 <p> paragraph.</p>

 </body>
 </html> 
 </textarea>
 <a href="#" rel="facebox" class="example">Example</a>
+1  A: 

Like this:

<textarea id="exampleSource">...</textarea>
<a href="#" id="openExample" class="example">Example</a>

<script type="text/javascript>
    $(function() {
        $('#openExample').click(function() {
            $.facebox($('#exampleSource').val()); 
            return false;
        });
    });
</script>

Demo

SLaks
erm...i try already,facebox just loading loading and loading only.
Try again; I just fixed it.
SLaks
erm...how to make it reusable?can just change the id(#) to class(.)?
Yes, you can change the selectors to whatever you want.
SLaks
erm...how to make it reusable??? i mean how to use the $this. for reusable???sorry im new
<script type="text/javascript"> $(function() { $('.openExample').click(function() { $.facebox($this('textarea').val()); return false; }); });</script>erm...totally wrong ?
That should be `$('textarea')`, not `$this('textarea')`.
SLaks