moopopup demo page
Welcome to the moopopup demo page!
Let's take a look at the examples provided, notice that the window aspect be easily styled through css!
First example
Let's create a window not draggable, not resizable, with a custom content and shown at the coordinates (300px, 200px) respect to the body.
var mp_instance = new moopopup({
draggable: false,
resizable: false,
top_left_x: 500,
top_left_y: 200,
title: 'My first example title',
text: "<p>Lol, I'm your content sir. Go and be antagonist fy</p>"
});
mp_instance.display();
run javascript
Second example
Let's create a window draggable, resizable, with no overlay which may open another window to play with the focus
var mp_instance = new moopopup({
overlay: false,
title: 'My second example title',
html_node: 'mynode'
});
mp_instance.display();
the html node with id mynode (I've put it after the code, clearly with style display none):
<div id="mynode" style="display:none">
This is the content of the first window, and now follows a link which opens another window: <span class="link" onclick="var mp = new moopopup({overlay: false, title: 'Fuck yeah', text:'Italian politicians go home!', top_left_x: 100});mp.display();">link</span>
</div>
run javascript
Third example
Let's create a window showing my home page using an ajax request. Well of course some css are missing and also some other functionalities because my home page is a complete document, but take it as an example, actually when using this functionality the ajax request calls a method output and not the whole document.
The window width is 800px, its content height is maximum 600px height and is draggable and not resizable.
var mp_instance = new moopopup({
title: 'My home page',
width: 800,
resizable: false,
max_body_height: 600,
url: 'http://www.abidibo.net'
});
mp_instance.display();
run javascript
Comments
blog comments powered by Disqus