Monday, March 27th, 2006
Javascript Windows Enhanced
Several sites make use of simple floating divs to make “windows” on a page, but what if you want something with a bit more refinement to it? With the help of Prototype and the script.aculou.us Javascript libraries, this post will show you how to make those popup “windows” sing.
This javascript class allows you to add window in an HTML page
This class is based on Prototype 1.4. The code is inspired of the powerful script.aculo.us library. You can even use all script.aculo.us effects to show and hide windows if you include effects.js file.
It has been tested on Safari, Camino, Firefox and IE6.
The script comes in a neat, simple download that makes it easy to use and easy to change the look of to match your site. Of course, examples are included (be sure not to miss those) and some limited documentation is included as well. He also mentions a specific use for it on his sites - to act as a debugger window for his Javascripts without messing up his layout or dealing with the hassle of alerts.













Good, i was making some script like this to me using scripts from script.aculo.us. Now i have some base to rewrite somethings in my script.
I did a windows script with scriptaculous a few months back.
It supports max/minimize, too, and has callbacks for saving window properties with Ajax.
http://www.uni-weimar.de/~scheffl2/wordpress/?p=20
Problem with both versions: Drag and drop is painfully slow in FireFox.
I don’t know if this is a problem with FF or with the scriptaculous DnD implementation
Uh, oh. This is sexy.
Uh, oh. This is sexoc.ulicio.us.
i like the window library from zapatec much more but thx4info
Interesting Finds
uh, not feelin it. this seems exactly like those windows made with good old “DHTML” a while ago. using scriptaculous and other tools to make them might make room for some whizz-bang, but the usability, size, and purpose gaps are still there.
Check out http://qooxdoo.oss.schlund.de/public/demo/example/Window_1.html for an alternative windows implementation as part of a comprehensive JS library.
How do I refer back to the parent page if I have passed a url to the window?
I was trying something of this kind on my personal homepage, with less results (but also less work, I guess!). Maybe I’m “ajaxed” too… and I didn’t know it.
ìž?바스í?¬ë¦½íŠ¸ë¡œ ë§Œë“ ìœˆë?„ìš°(íŒ?ì—…)
do translation into Korean.. :) 몇몇 사ì?´íЏ 들ì?€ window.open() 으로 íŒ?ì—…ì?„ 쓰는 ëŒ€ì‹ ì—? 페ì?´ì§€ 않ì—?서 div 를 ì?´ìš©í•˜ì—¬ 페ì?´ì§€ 안ì—?서 “windows’를 만들어 사용한다. 하지만, 좀ë?” ì„¸ë ¨ë?œ 형태를 ì›?한다ë…
good
exactly what i needed.
futuristic look and feel, easy to use.
the script looks like it uses the tag to insert the window.
oddly enough, i dont have a body tag in non of my pages….
is this configrable? if not maybe the author should change the script so that when creating the window i can send the element i want to insert the window after… (not by ID though due to my use of a library that generates on the fly IDs…)
i gave this 5 stars as it is perfect for my current needs.
How to use these windows as getID ();
I do not be getting
I want to open her with the values of an ID
El futuro es AJAX………¡¡¡¡¡¡¡¡¡¡¡
Thanks! Awesome post!
I am trying this script library in one of my projects. Is there available addon to this library that will enable me to minimize the window in a specific location in webpage. Like some sort of status bar.
Hey
I dont speak English very well,
but I like read sometimes blogs in other languages,
I dont understand all,
but I must say I enjoy Your post :)
Greetings