Smoothbox, Thickbox for mootools
May 15th, 2007Author : Boris Popoff
Based on Cody Lindley’s Thickbox, MIT License
Smoothbox is the Mootools conversion of Thickbox, a script running on JQuery.
For the description and the features, you can go to Thickbox’s website, as they are basically the same.
The main difference from a user point of view is that I’ve added some effects when the box shows up and on scroll.
Update 23/06/2008 : I have updated smoothbox.js, now it is compatible with mootools 1.2. If you needs the old one, you can still download it there. Sorry, no class for the moment, i dont have enough time 
Edit : Well it seems to be all messed up in IE, I’m going to see what’s going on, for now it’s safer to use the older one.
Update 16/08/2007 : Now Smoothbox uses only 100% W3C Valid CSS 
Opacity is now set with Javascript and not in CSS. An IE CSS hack has been updated to use * html instead of _attribute.
Update 12/06/2007 : When you used the iframe and followed some links, the smoothbox was flickering on each page loading. This is fixed.
Download
Single Image
Demo
HTML
<a href="images/single.jpg" title="add a caption to title attribute / or leave blank" class="smoothbox"><img src="images/single_t.jpg" alt="Single Image"/></a>
Gallery Images
Demo
HTML
<a href="images/plant1.jpg" title="add a caption to title attribute / or leave blank" class="smoothbox" rel="gallery-plants"><img src="images/plant1_t.jpg" alt="plant 1" /></a> <a href="images/plant2.jpg" title="add a caption to title attribute / or leave blank" class="smoothbox" rel="gallery-plants"><img src="images/plant2_t.jpg" alt="plant 2" /></a> <a href="images/plant3.jpg" title="add a caption to title attribute / or leave blank" class="smoothbox" rel="gallery-plants"><img src="images/plant3_t.jpg" alt="plant 3" /></a> <a href="images/plant4.jpg" title="add a caption to title attribute / or leave blank" class="smoothbox" rel="gallery-plants"><img src="images/plant4_t.jpg" alt="plant 4" /></a>
Inline Content
Demo
HTML
<a href="#TB_inline?height=300&width=300&inlineId=myOnPageContent" title="add a caption to title attribute / or leave blank" class="smoothbox">Show</a>
iFramed Content
Demo
HTML
<a href="ajaxOverFlow.htm?keepThis=true&TB_iframe=true&height=250&width=400" title="add a caption to title attribute / or leave blank" class="smoothbox">Example 1</a> <a href="ajaxLogin.htm?keepThis=true&TB_iframe=true&height=300&width=500" title="add a caption to title attribute / or leave blank" class="smoothbox">Example 2</a>
AJAX Content
Demo
HTML
<a href="ajaxOverFlow.htm?height=300&width=300" title="add a caption to title attribute / or leave blank" class="smoothbox">Scrolling content</a> <a href="ajaxOverFlow.htm?height=480&width=640" class="smoothbox" title="add a caption to title attribute / or leave blank">No-scroll content</a> <a href="ajaxLogin.htm?height=100&width=250" class="smoothbox" title="Please Sign In">login</a>
Warning: Unknown(/home/bpopoff/gueschla.com/myShare/myShareWP.php): failed to open stream: No such file or directory in /homez.232/fandelad/gueschla.com/wp-content/plugins/exec-php/includes/runtime.php(42) : eval()’d code on line 116
Warning: (null)() [function.include]: Failed opening ‘/home/bpopoff/gueschla.com/myShare/myShareWP.php’ for inclusion (include_path=’.:/usr/local/lib/php’) in /homez.232/fandelad/gueschla.com/wp-content/plugins/exec-php/includes/runtime.php(42) : eval()’d code on line 116
May 19th, 2007 at 12:47
Great work
this is a really nice script
thanks a lot for sharing it
May 19th, 2007 at 23:43
thanks a lot, it’s nice to only need one framework and I happened to need moo tools.
May 20th, 2007 at 12:44
one thing (found on another buggy plugin) : possibility to have a “fullscreen” box (iframe or Ajax or Inline) … which takes 100% of height and size of the body screen (maybe with some little margins
)
May 21st, 2007 at 13:51
Good great script, i’ve been looking for a lightbox style effect for inline content instead of just images. I needed one for movies. There are like 50 different types of lightboxes out there. There’s the original lightbox, theres slimbox, leightbox, iBox, Greybox, Greybox Redux, and tons more. But this one is simple and straightforward. Good job.
May 21st, 2007 at 14:06
@orfaon,CssProdigy : Thanks, that’s cool if you appreciate it
@Rod : Nice idea, maybe in a future release
May 21st, 2007 at 14:59
Okay I’m really confused for some reason, I got it working great on Firefox, safari, etc … but for SOME REASON (cough cough) it’s not working on IE? Your site works great in IE – what am I missing? (link)
May 21st, 2007 at 15:15
With Mootools, the first thing to do is to use a valid strict doctype. In my firefox the smoothbox of your page is not well positioned because of that. In which version of IE do you have the problem ?
May 21st, 2007 at 15:26
There you go! That fixed the issue. I was using IE7 and adding a valid strict doctype was the answer.
May 27th, 2007 at 19:49
I have a problem with implementing the smoothbox and that is trying to find a way to implement the code. I already downloaded the components needed but I can’t seem to know what are the links I need to put in the “head” section of the page.
May 31st, 2007 at 08:58
I noticed that the iframed content sometimes flickers when it loads in Firefox. I had seen this when I tested it, but I thought it was something I did wrong. However, now I see the same thing on your site. Doesn’t happen anywhere except on iframe content loaded in smoothbox. Also, it doesn’t always happen. It usually won’t happen the first time you run the script in Firefox, but on subsequent attempts, it does. Any suggestions?
May 31st, 2007 at 19:04
I just noticed that in smoothbox.css, there is a typo on the very last line.
An accidental underscore on “_margin-bottom”.
I don’t know if this is what was causing the problem in Firefox, but it could be related since the css element that typo is on is for the iframe content.
June 1st, 2007 at 08:55
The underscore “typo” is probably for IE. Other browsers ignore it.
Btw thanx for sharing!
/T
June 1st, 2007 at 17:41
Are you planning on including the “modal” option that thickbox has, (it means you need to close the windows with a close funtion) pressing outside the window will not work
June 2nd, 2007 at 04:41
This doesn’t seem to be working for me with MooTools 1.1. I’m getting the error “Fx.Style is not a constructor”.
Any ideas?
June 2nd, 2007 at 08:26
Sorry for the false alarm. I re-downloaded MooTools and it’s working now. Thanks, this is perfect!
June 4th, 2007 at 09:31
Steed > You need to include mootools.js, smoothbox.js, and smoothbox.css
Reece Conrad > Thanks for the report, I’ll look into that.
Moroswitie > OK, maybe in the next version !
June 4th, 2007 at 16:21
I’ve got a small request…
Is it possible for the overlay to appear first, and then the loading gif?
I don’t know enough about js to make the changes myself, but I assume this is possible. Any suggestions?
June 12th, 2007 at 14:58
Juste un petit souci que j’ai rencontré :
La fonction TB_showWindow() est appelée á chaque rechargement de page, donc si vous ouvrez une iframe dans la smoothbox avec un form, lorsque vous cliquez sur submit, le fading de transition (Fx.Transitions.sineInOut) est rappelé et l’effet est désagréable car c’est asynchrone… En clair vous faites un submit, ca affiche le resultat et tout d’un coup, le fading est executé…
J’ai changé le code pour ne faire exécuter la transition que la première fois mais peut-être y-a-t-il une meilleure solution?
June 12th, 2007 at 15:01
Salut Alan,
Eh bien, tu as bien fait de changer le code, en effet j’avais remarqué ce problème, et je compte le corriger quand j’aurais un moment !
June 12th, 2007 at 16:15
Pour ceux qui sont interessés, voici la solution (tres simpliste) que j’ai implementée:
Dans smoothbox.js, rajouter une variable globale (au debut du fichier) :
doneOnce = 0;
Puis changer la fonction TB_showWindow() (l.259):
function TB_showWindow(){
// $(”TB_load”).remove();
// $(”TB_window”).setStyles({display:”block”,opacity:’0′});
if (doneOnce==0) {
doneOnce = 1;
var myFX = new Fx.Style(’TB_window’, ‘opacity’,{duration: 750, transition: Fx.Transitions.sineInOut, onComplete:function(){if ($(’TB_load’)) { $(’TB_load’).remove();}} }).start(0,1);
}
}
PS: merci pour le script, en tous cas, je peux te dire que je l’utilise pour le site web de mon entreprise dont je suis obligé de taire le nom mais qui est tres connue.
June 12th, 2007 at 16:33
Merci à toi pour le bout de code !
Mais avec ta solution, on ne pouvait pas fermer et ré-ouvrir la fenêtre, l’overlay ne disparaissait pas.
J’ai adapté ton code, c’est corrigé maintenant (fonction modifiée + ligne 291 ajoutée)
C’est cool de savoir que tu utilises mon script pour le site de ton entreprise, cela fait toujours plaisir quand son travail est utilisé.
June 12th, 2007 at 16:35
@ Reece Conrad > I think the flickering problem you were speaking about was the one that Alan has pointed out. It should be fixed now.
June 17th, 2007 at 18:26
How to bring dynamic content into the Smoothbox ?
PHP, POST!, Submit per form, AJAX ?
Is this possible ?
June 18th, 2007 at 13:37
Is there any way of getting this script to open links in “parent” page when clicking something inside an iframed page?
So links on iframed page would NOT load inside the smoothbox
Thanks!!
June 22nd, 2007 at 21:21
Thanks again for all of your work. I’m so glad you developed this script, espcecially after I found that Thickbox was causing a problem with slow page loads on one of my testing machines. I put smoothbox in instead, and it worked like a charm. Thanks again!
June 26th, 2007 at 21:37
Thanks a lot for a really great script!
But; I’ve changed a bit in it – removed the resizing, all close buttons are now at the top and made two different window-positions depending on the content of the window (top 95px or vertical center).
Look at it here: http://www.tramsmail.se/tramsfiler/
Have nice day, Raffe Bergwall
June 27th, 2007 at 16:34
Salut, la seule chose qui me manque dans ta box c’est la possibilité de créer des wizards… c’est-à-dire d’ouvrir une box, de mettre des liens à l’intérieur de celle-ci ou des formulaires, sur le click ou l’envoi le contenu de la box devient celui du lien cible ou de l’action du formulaire.
D’autres box le font :
-prototype :
http://particletree.com/features/lightbox-gone-wild/
http://wildbit.com/demos/modalbox/
-mootools :
http://forum.mootools.net/topic.php?id=682#post-3047
Serait-il difficile d’ajouter cela à smoothbox ?
June 27th, 2007 at 16:38
guix > Tu peux faire cela via des iframes.
June 27th, 2007 at 18:02
Avec des iframes, c’est un peu lourd, et je suis pas sûr du tout, vu que mon wizard sert surtout à insérer des choses dans une textarea : j’ouvre une box, la remplis en php avec plusieurs écrans s’echaînant avec des GET et des POST, puis à la fin j’écris dans ma textarea, tout ça sans poster la textarea bien sûr vu qu’il s’agit d’un éditeur de page un peu hybride texte/graphique.
July 3rd, 2007 at 11:37
I had a strange problem with the positioning of the box when using inline content.
This link
…
didn’t work because the TB_HEIGHT was NaN in TB_Position function.
I got it working by adding dummy query parameter to the url
…
July 12th, 2007 at 20:51
I used the “Inline Content” version and I’m seeing unwanted grey borders around image that I placed in the smoothbox. The text content shows up fine. Any ideas how to fix this?
July 12th, 2007 at 21:43
I’ve found the solution in the css file. There’s setting to put borders around img. Another question, I’m trying to add a link in the content that will close the box. This is in addition to the “close” link on top. How do I do this?
July 18th, 2007 at 16:14
[...] stupefacenti. In molti conoscono Mootools-Moo.fx, Prototype-Scriptaculous, jQuery e derivati: Smoothbox, Thickbox, Modalbox, MOOdalbox, Slimbox e chi più ne ha più ne metta.. L’ultima scoperta è [...]
July 26th, 2007 at 00:55
Working great.
Thanks.
July 27th, 2007 at 16:24
Mike B > For Inline / Ajax content : TB_remove()
For iframed content : parent.TB_remove()
August 8th, 2007 at 10:33
BUT, for this fantastic script, how can I use javascript to open it as Smoothbox does.
Thanks.
August 9th, 2007 at 11:37
I love the script and it helped me much in my task
but
filter:alpha(opacity=0); not valid css
is not css valid
how can we fix this?
August 9th, 2007 at 11:41
benn > You can set the opacity with javascript, it’s the only valid way that I know : $(’TB_overlay’).setStyle(’opacity’,0);
August 9th, 2007 at 11:45
you are fast bratka!
so this should work
$(’TB_overlay’).setStyle(’opacity’,0);
is that right?
August 9th, 2007 at 11:45
not takong code smart
scri
$(’TB_overlay’).setStyle(’opacity’,0);
/scri
right?
August 11th, 2007 at 18:26
Hello,
Your plugin looks great. I’ll try it any time soon.
Just one point: arrow keys doesn’t seem to work in the image gallery.
August 13th, 2007 at 22:28
Hi, great script.
One suggestion – would you mind adding a ’src’ attribute to the initial creation of the IFRAME in smoothbox.js. Basically the problem is that in IE 6 under https: you’ll receive a “this page contains secure and nonsecure content”. I’ve added a fix on our end but it’d be great to see this rolled into the script.
Anyway, how I corrected this for our needs was to change the line that creates the IFrame to:
new Element(’iframe’).setProperty(’id’, ‘TB_HideSelect’).setProperty(’src’,'blank.html’).injectInside(document.body);
That seemed to do the trick. I’m not sure if there is a more elegant solution but just a suggestion.
Thanks for contributing a great script!
August 14th, 2007 at 23:59
I’m using the gallery images feature and I’m seeing a flicker whenever I click on the next and previous buttons. It looks like the image loads in the top left and then moves back to the center. This only happens in Firefox 2.0.0.4 and works fine in IE (strangely enough). Here’s my page: http://www.chadvernon.com/blog/stills/ Any help would be greatly appreciated. Thanks!
August 15th, 2007 at 00:26
I seemed to have fixed it by adding a TB_position(); call in the buildClickHandler function above the TB_show call around line 168. Thanks! Great script!
August 16th, 2007 at 14:38
Brian S > I think your fix is quite good. Not everyone needs it, so I dont plan to add it to the script though.
August 16th, 2007 at 14:39
Alakhnor > You can use the “< " and ">” keys on the keyboard for that (on a qwerty keyboard)
August 17th, 2007 at 00:20
Im trying to use submit button on your soomthbox, upon clicking submit, the navigation should go to the page which contains the smoothbox. but what hapenning is its opening the page in the smoothbox .
Is there anything you can suggest me to fix this problem?
August 17th, 2007 at 01:44
Is there any way of getting this script to open links in “parent” page when clicking something inside an iframed page?
So links on iframed page would NOT load inside the smoothbox
Thanks!!
same question as ditman!
great script btw..
August 17th, 2007 at 09:19
prasad > You can use the attribute target=”_top” on your links, this should work
August 17th, 2007 at 10:36
Hi guys, i’ve added the mootools and all the included files here to my page. I’ve mad a div called ‘myOnPageContent’ with some text and added the link
Show
It is not working, nothing happens when i click show. I’ve added the mootools 1.11.js file, the smoothbox.js file, the smoothbox.css file but it doesn’t seem to work. Please help
August 20th, 2007 at 14:45
I think smoothbox not works with Mootools 1.11. I have same problems. Somebody is able to fix it?
August 20th, 2007 at 19:44
Im having a different problem. When I click on a smoothbox link, it shows the smoothbox with length 100% and no content, then it disappears, then it does the fade to black and then shows the proper sized smoothbox with content. Everything works great, except for that initial display of the smoothbox, we could definitely do without that
August 20th, 2007 at 19:47
Also how about hiding scrollbars and flash content (not sure if it does) since even using your example, it scrollbars in firefox display through the black background layer of the smoothbox.
August 29th, 2007 at 05:24
Hi. I’m using the smoothbox to display a hidden div which contains two inputs for username and password and a submit button. When I click in the submit button I would like to get those values (to send an ajaxRequest) but it seems I can’t access them using the simple document.getElementById(’username’). If someone could help me with this it would be great. Thanks
August 29th, 2007 at 12:25
thanks a lot, this script is amazing!!!!
August 29th, 2007 at 16:23
This worked great! I had first attempted to use JQuery + Thickbox3, but it conflicted with my use of MooTools. You saved the day with this rewrite of Thickbox!! Nicely done.
August 29th, 2007 at 21:44
Can’t switch beetween pictures in Opera 9. Bad…
August 29th, 2007 at 22:00
Bug report: the var “queryString” should only look at the string after #TB_inline. If the existing page has anything in the querystring, an inline content Smoothbox open will fail (and place the resulting content at the very bottom of the page, under all existing content).
I’ve verified this bug on this page by adding “?test=x” to this URL. Upon reload, your inline content examples fail to work correctly.
My solution is to update the “var queryString” line to the following:
var queryString = url.split(’#TB_inline’)[1].match(/\?(.+)/)[1];
August 29th, 2007 at 22:54
cogratulations, great job.
this script is great and simple but I have observations to make about them:
- when you are in the gallary for instance and you press tab you still can change the value of the fields (input’s) and/or submit or postback (submit buttons, dropdowns etc).
- why do you close the window between loadings ???
September 2nd, 2007 at 07:23
Can we pass some values from the modal page to basepage and vice versa ? a code snippet for the same would be of great help.
thanx
pomp
September 2nd, 2007 at 07:34
Its good! and useful too!
Thanks a lot!
September 2nd, 2007 at 16:22
pomp > Yes you can :
http://developer.mozilla.org/en/docs/DOM:window.parent
http://developer.mozilla.org/en/docs/DOM:window.frameElement
Ptomos > 1/ Yes it’s a browser behaviour, It can be overridden, but it would be kind of an ugly hack though.
2/ I think it’s nicer
September 2nd, 2007 at 16:30
It works just fine.
Appreciate ur help
pomp
September 3rd, 2007 at 23:04
Here with we would like to thank you for your script and informe you that we combined smoothbox and moviebox and created Joomla Plugin
you can find it here
http://www.demo.youjoomla.com/moviebox/index.php
Best regards Youjoomla.com Team
September 4th, 2007 at 15:10
I am getting a javascript error saying “Object does nto support this property” when closing the popoup on iframe mode at line marked with *.
function TB_showWindow(){
$(”TB_load”).remove();
* $(”TB_window”).setStyles({display:”block”,opacity:’0′}); *
this error only occurs only on IE and no on firefox.
Also the shadowed image size is limited only to teh visible area, as a result half the is covered and rest half remains clickable.
September 4th, 2007 at 15:17
I m getting a javascript error “Object does not support this property or method” at the line marked with * on IE, this error does not come on firefox
function TB_showWindow(){
$(”TB_load”).remove();
* $(”TB_window”).setStyles({display:”block”,opacity:’0′}); *
Also in my case only visible area of the page is darkened with the image and the rest of the page remains clickable.
How can i change the sixe of tehis image.
pomp
September 5th, 2007 at 06:25
Dear Developer,
Bug report : Your script is gre8, fantabulous work done here, i found one bug
when i use the lightbox for loading .html file, and if i have used “DIV” tag inside the .html file, it works perfactly in FireFox but in IE DIV tag is display after the content finished. Though i specify “DIV” tag’s position to absolute and i gave left and top values as well. What is the problem. In your example script’s .html page, if we add “DIV” tag and if we place it over content, same problem occures in your example as well. What is the probelm here ?
Thanks,
Nishant
September 6th, 2007 at 03:45
Same as Michael – except that for me, everything is pushing off the bottom, not just the inline. There is a querystring in the url so I’m hoping that that’s all it is. I’ll delve a little deeper later, unless someone else comes up with something (I couldn’t get Michael’s fix to work for me).
September 10th, 2007 at 17:14
Bonjour, j’ai trouvé votre site via une recherche sur google, je trouve que vous avez fait un bon travail et je vous en courage a continuer, vous êtes sur le bon chemin.
Bon passant à l’action
j’ai utiliser le script de la galerie et celui de inline content ca marche à merveille, par contre celui de Ajax content ça na pas marché, la page se bloque au chargement et rien n’apparait !
Pourriez vous m’éclairer un peu plus.
merci d’avance
September 11th, 2007 at 07:17
THANK YOUUUUUUUUUUUUUUU!!!!!!!!!!!!!!!!!!!!!!
WITH THIS SMOOTHBX I CAN USE MOOTOOLS+MGMEDIATHICKBOX + SMOOTHBOX!!!!!
WILL YOU MARRY ME?
LOL
September 13th, 2007 at 19:54
I know believe the problem to be with tables in general. I’ve got two test pages with nothing more than tables on them and the popup box always pushes out to the bottom of the table.
September 13th, 2007 at 19:55
I mean “now.”
September 13th, 2007 at 22:44
Nevermind… it’s not tables. I was having a problem with TB_HEIGHT being NaN. I’m not providing a height in the link – maybe that’s the problem. I added:
if(isNaN(TB_HEIGHT)) TB_HEIGHT = 0;
into both TB_position() and TB_positionEffect()…
Hope that helps someone.
jj
September 13th, 2007 at 23:15
Ack! Nevermind again. Don’t use my ‘fix.’ Now when I scroll I can never reach the bottom of my popup because it’s off the screen. I guess I’ll have to provide a height.
September 15th, 2007 at 09:05
Is the compatibility profile for Smoothbox identical to that of Thickbox, or does it work in different browsers than its predecessor?
September 17th, 2007 at 10:16
Great work, thanks a lot
September 18th, 2007 at 14:05
Bonjour,
vraiment bien cette … xièmeBox
Tout d’abord : merci !
Ma question concerne l’utilisation “Inline” et les CSS.
Ex :
- J’ai une div :
Blablabla…
- Et donc en CSS :
#myDiv {width:100px;height:auto;}
#myDiv p {background:#ccc;}
A l’appel de la box, aucun de mes styles n’est pris en compte… En revanche si je met les styles directement dans les code et les balises, c’est ok, genre :
Blablabla…
Il semble que, à la moulinette du code javascript, tous les styles disparaissent et son remplacés par des #TB_ …
Y’a t’il un moyen de contourner ceci ?
Merci
September 18th, 2007 at 14:31
Bon, n’étant pas patient /-) j’ai fouiné dans le code et j’ai ajouté ceci :
// prevent javascript error before the content has loaded
TB_WIDTH = 0;
TB_HEIGHT = 0;
MyClass = ”; /* “+caption+”close“;
}
- Ensuite l’appel par la balise devient :
Show
Et, ça marche… enfin pour le moment…
September 18th, 2007 at 23:17
[...] SmoothBox http://gueschla.com/labs/smoothbox/ [...]
September 19th, 2007 at 12:55
Hi,
thanks a lot for your script, but I can’t make it work with mootools 1.11. If I downgrade to 1.1, it works.
Thanks again
September 19th, 2007 at 22:24
[...] Enlace / Peso: 15kb / Framework: jQuery / Descargar / Otras versiones: Slightly ThickerBox , Smoothbox, [...]
September 20th, 2007 at 13:10
Smoothbox is causing huge memory spikes in IE whenever the effect runs. Is anyone else having this experience?
September 26th, 2007 at 13:26
I’ve a problem when I use smoothbox into a div loaded by an ajax call (created by mootools lib)….
You can say me why????
September 26th, 2007 at 16:46
Hi all,
If there a way to have a 3000ms timeout on a box? (Auto fade out?)
October 5th, 2007 at 16:28
ponsfrilus > Yes, you have to deal with setTimeout or .delay and TB_remove
October 11th, 2007 at 06:13
does anyone have a fix for working with inline ajax forms?
when the requested div is inserted into the thickbox popup div, events added in the mootools manner (.addEvent) no longer work.
October 12th, 2007 at 14:19
Hi,
We use smoothbox into Copix, but we need to add 2 lines on you code.
Only to know when the box is opened and close, we have added fireEvent on TB_showWindow and TB_remove.
This to have possibility to get elements inside the box with mootools and add some effects.
Example:
window.addEvent(’TBwindowshow’,function(){
$$(’#TB_ajaxContent a img’).each(function(img){
img.setStyle(’opacity’,0.5);
var fx = new Fx.Styles(img,{duration: 500, wait: false});
img.addEvent(’mouseover’,function(){
fx.start({
‘opacity’: 1.0
});
});
img.addEvent(’mouseout’,function(){
fx.start({
‘opacity’: 0.5
});
});
});
});
October 14th, 2007 at 07:51
@Boris Popoff,
Great script.
Thanks alot of sharing it.
At the start I had some problem on my template using ajax loading effect, but I fix it.
October 18th, 2007 at 11:02
I am experiencing memory leak in IE6. Every time close a box, it doesn’t release the memory! The memory usage just keep raising and raising… anyone have any idea how to fix it?
October 19th, 2007 at 00:10
Nevermind, I found the solution!
http://forum.mootools.net/viewtopic.php?pid=28328#p28328
October 19th, 2007 at 04:12
I’m having problems using smoothbox in IE with the elements of a form.
In this case is a ’select option’ which displayed above the window smoothbox generated, here can see the problem. (http://dev.deepinphp.com/downloads/example.jpg)
What could be the problem?
October 20th, 2007 at 01:35
Unfortunately, in IE, form elements are always on top of any other layer (yes stupid i know).
I haven’t tried, but this might shed you some light:
http://shepherdweb.com/2007/02/14/z-index-ignored-for-select-element-in-ie-6-workaround/
October 31st, 2007 at 16:51
I also made a change to have my page XHTML Valid:
In TB_parseQuery ( query ) function i did
var pairs = query.split(/[;&(&)]/);
Regards,
October 31st, 2007 at 16:52
in my last post: & = query.split(/[;&(&\amp;)]/);
November 2nd, 2007 at 06:48
If i want to focus on new window, without click new window.
If i made scrolling new window, i must click new window first and scroll with keyboard. Can i made my new window that no click first, thx
November 5th, 2007 at 05:11
Boris,
Thank you very much for this script. I have been needing a “Thickbox” type script for a website based on Mootools. This will save me a lot of time.
Do you have any plans to fix the Flash and Scrollbar issues? If not, I may create a fix for it and send it to you and post here.
Thanks again!
Erik
November 6th, 2007 at 04:30
Ok, so I added functionality to this script to hide flash elements when the Smoothbox is activated and reveal it when the Smoothbox is hidden. (Thanks to the Mootools based Slimbox for this code) Here is a link to the file: http://www.xponix.com/files/js/smoothbox.js
I added a call to a new “TB_objectHide()” function at line 42 (within the TB_show() function:
//Hide all flash and “select” objects
TB_objectHide(true);
I added a call to a new “TB_objectHide()” function at line 277 (within the TB_remove() function):
//Hide all flash and “select” objects
TB_objectHide(true);
I added this function at line 39:
function TB_objectHide(open){
var elements = $A(document.getElementsByTagName(’object’));
elements.extend(document.getElementsByTagName(window.ie ? ’select’ : ‘embed’));
elements.each(function(el){
if (open) el.lbBackupStyle = el.style.visibility;
el.style.visibility = open ? ‘hidden’ : el.lbBackupStyle;
});
}
November 7th, 2007 at 19:19
Thanks a bunch for this awesome script! well done!
November 9th, 2007 at 07:04
opacity does not work with ie6. Any solutions?
November 9th, 2007 at 12:35
memory leaks when i click an image using ie7 in this page. Do you know any solution?
November 9th, 2007 at 21:23
Is this still not working in mootools 1.1?
November 9th, 2007 at 21:26
amrish > It’s working, example => http://assistancefree.fr
… > It’s working for me on several computers.
Erik Hansen > Thx for sharing your mod !
November 9th, 2007 at 21:27
ktml > Your link to the mootools forum about the “garbage destructor” is useful, thanks !
November 9th, 2007 at 21:29
I just get a loading screen, my content disappears instantly after displaying full width at the bottom of the page.
November 9th, 2007 at 21:31
Once I get this to work I’m going to work in a few features I worked into Thickbox.
* percent based sizing
* variables for fade
November 9th, 2007 at 22:13
The loading image stays on the page after I click away from it too, I can’t seem to figure it out.
November 11th, 2007 at 19:09
Is there a place where we can discuss this program that is easier?
I’d like to get it up and running, been working on it, but that issue keeps happening.
November 13th, 2007 at 12:38
Hi there, first of all -> awesome script – one question.
I have images in this format (i can’t change the names, they are from an crm export) 1180-lang2#aplan_fromanywhere_8.jpg
The Problem is the # in the link name – if i change it in the links to %23 the script works perfect in IE7 and Firefox and even local in IE6 but on the server it doesn’t work in IE6 – because of the # in the name.
I’ve tried every Lightbox Script out there but it’s always the same result. Is there a way to solve this?
Thank you so much!
November 14th, 2007 at 01:57
Hey boris,
Im having problem getting focus on a field in a smoothbox, im using onload(), but sometime it works and somethin its doesnt, is there any way to do this? Do you have any suggestions?
Thanks a bunch!
November 14th, 2007 at 11:53
Bonjour,
j’ai intégré la SmoothBox pour insérer au dessus de mes pages des infos, mais je souhaitais également que le lien puisse être appelé depuis une touche clavier, j’ai essayé ces deux solutions, mais ça ne fonctionne pas, graphiste je ne suis pas très forte en JS, qu’eulqu’un peut m’aider ? Merci. C.
Dans le JS :
$$(”a.smoothbox”).each(function(el){el.onclick=TB_bind});
$$(”a.smoothbox”).each(function(el){el.onkeypress=TB_bind});
Ou dans le lien :
Mode
November 15th, 2007 at 10:03
Hi, somme body can help me? I’ld create shortcuts to call the SmoothBox function. I’ve tryed this but nothing appears when I use the keyboard. I’m a compugraphics and not JavaScript expert, someone can tell me what can I do?
I’ve try this
$$(”a.smoothbox”).each(function(el){el.onclick=TB_bind});
$$(”a.smoothbox”).each(function(el){el.onkeypress=TB_bind});
and too, a onkeypress event inside the link, but it’s wrong too
Thanks a lot
C.
November 19th, 2007 at 12:08
Hello,
First of all, thank a lot for your nice script. It avoid the use of the old looking standard popup !
I’ve got a bug under Safari for Mac (not for PC), after having implemented several smoothbox links in the same page. The first link fires OK but the followings don’t seem to understand the class “smoothbox” and display the popup.htm in a new window as if Javascript was disabled. This bug only appears under Safari. Ths page works great under IE 6-7, Firefox and Opera. This is so frustrating ! Do you have a light of solution ?
THanks !
November 26th, 2007 at 16:52
nice work been looking for a good lightbox on mootools, Ive been using slimbox but that doesn’t allow anything apart from images and lytebox which was almost perfect but isn’t mootools…anyways i was just wondering if there was a way to make smoothbox look more like the traditional lightbox. Cheers
November 28th, 2007 at 16:41
Hi all, and thanks a million for all the hard work on such a great script! Has anyone tried to make this script act like a javascript popup helptip style, knda like the Snap Shots or WebSnapper stuff. What i want is for the link to activate the smoothbox effect “onMouseover” specifically the No-Scrolling url style. for example
“No-scroll content”
when you mouseover a link like that it activates the smoothbox effect without having to actually click it??? Thanks to anyone that may be able to advise me on how to modify the code to acheive this
November 30th, 2007 at 07:33
Hi there,
@Leo > I also have an issue with Safari (Mac), first smoothbox fires OK but others will keep loading with the content of the first one…
Works like a charm in FF and IE.
Any idea?
Cheers!
December 2nd, 2007 at 02:35
Hello,
I’m having the same problem as amrish in firefox where the loading graphic won’t disappear and the problem that Leo is having in safari on OSX where multiple html items will only show the first html item when clicked. Anyone make any progress on any of thees bugs?
December 3rd, 2007 at 13:44
Hi this is great what you’ve made. I have one question though is it possible to use this script when page loads so without clicking one div loads with some content I write? thank you for any answers
December 3rd, 2007 at 21:17
@Pierre: It’s a safari rendering or caching bug. Oddly enough, it only seemed to a happen to me when I pressed refresh on the page, if you reload the whole page by clicking on a link it seems to go away. To fix the problem I added this line right after line 227:
$(”TB_iframeContent”).src = urlNoQuery;
This forces the iFrame to actually have the right content in it. This DOES mean you are telling the browser to load the iFrame content twice, so you might want to point the initial iFrame load to a small junk file to save on bandwidth.
@Nathan: Try this for fixing the loading graphic: After line 296, which is the one that removes TB_HideSelect, add this line:
if ($(’TB_load’)) { $(’TB_load’).remove();}
If the loading graphic didn’t go away when it was supposed to, this will make it go away when you fade the box out. I added this change to my version because I know there are some folks out there that double-click links, and if you double-click these smoothbox links it’s possible to put them in a funny state.
December 4th, 2007 at 15:30
Buenos dias,
Gracias por el script. tengo problemas enviando el focus al primer campo del formulario. alguna solucion o sugerencia te agradeceria.
he intentado con onload (). la pagina sola se ejecuta bien pero cuando agrego el efecto mootools no lo ejecuta.
Gracias
December 17th, 2007 at 14:46
Hi ,
when i open popup with smooth box my popup control gets locks or readonly.
some time parent page also
December 18th, 2007 at 08:23
does anyone have some examples of posting from a form inside of a modal to another modal?? And how do you pass the form variables?
December 18th, 2007 at 13:55
after:
if(url.indexOf(’TB_iframe’) != -1){
urlNoQuery = url.split(’TB_’);
$(”TB_window”).innerHTML += “”+caption+”close “;
} else {
$(”TB_window”).innerHTML += “”+caption+”close“;
}
add:
if(window.webkit)
$(”TB_iframeContent”).src = urlNoQuery;
to fix safari reload-iframe cache bug
December 19th, 2007 at 18:46
Boris,
I want to start a Smoothbox from a js event like onclick of some function so do you know i do this ? there are some forum ?
regards
gabriel
December 21st, 2007 at 05:16
Hi Boris,
I am using Smoothbox to call an AJAX form from inline content.
When I open the inline form with Smoothbox, everything looks fine.
However, when I submit the form, instead of showing the contents in the Smoothbox, it refreshes the entire window for the submitted results.
Is there anyway you can help me?
December 31st, 2007 at 17:22
Great Work!
God Job!
Excelent Script!
January 4th, 2008 at 02:45
[...] Smoothbox, Thickbox for mootools [...]
January 6th, 2008 at 20:44
I love your script, but I have a small issue I’ve been unable to figure out, as I’m not a javascript person. How can I center the loading image? I’m using a loading bar that is 220 pixels wide. Anyone have a fix? Thanks.
January 7th, 2008 at 14:44
Is there a reason why live validation from http://www.livevalidation.com doesn’t work if using the lightbox?
January 8th, 2008 at 20:32
Silly question. When creating a gallery. Is there a way to remove the blue bars around the smaller link images?
http://www.specsounds.com/drop.html
Thanks!
January 14th, 2008 at 21:13
[...] MooTools, dar noutatea adusă în plus faţă de predecesorii săi ( MOOdalBox, Slimbox, Smoothbox etc.) este efectul de zoom ce pleacă din link şi că poate afişa streamuri flv, mov, rm, wma şi [...]
January 22nd, 2008 at 06:31
Looks like in IE smoothbox gets kick started to early from time-to-time and TB_bind doesn’t get applied to all anchor tags with class smoothbox.
To fix this I replaced
window.addEvent(’load’, TB_init);
with
if(window.ie){
window.addEvent(’load’, TB_init);
}else{
window.addEvent(’domready’, TB_init);
}
January 22nd, 2008 at 06:31
Sorry I meant I replaced
window.addEvent(’domready’, TB_init);
with
if(window.ie){
window.addEvent(’load’, TB_init);
}else{
window.addEvent(’domready’, TB_init);
}
January 23rd, 2008 at 23:48
Thanks !..
January 25th, 2008 at 20:35
EXCELENTE MI AMIGOOOO!!
I was looking for this exactly component for Mootols >DDD great and thanks a lot!!! I-m integrating it in the Zen Cart with the Zen Magick, check later http://dev.imaginacolombia.com
January 28th, 2008 at 14:43
I really love thos box, but I have a problem with the “release” of a movie played in the box. In IE it dosn’t stop from playning when close on popup. How do I correct that?
http://www.tramsmail.se/fil.php?id=9882
February 8th, 2008 at 10:14
Hi,
I made some small changes to smoothbox, allowing the enduser to set some options w/o having to edit the .js himself.
Basically, I made some numeral constants variables (like min and max alpha for the overlay and content) and allowed to disable the feature that automatically closes the content if the bg-overlay is clicked.
Since there was no contact email, I’ll simply post a link to the modified .js
http://www.steinke.net/smoothbox.js
The changes are rather small, but it would be cool if you could add them to smoothbox.
To use, simply do something like:
TB_setCloseOnOverlayClick(false); // don’t close if clicked outside of the content
TB_overlayMaxAlpha=0.001; // don’t show the overlay layer
February 8th, 2008 at 10:28
Hi Guys,
Can someone help me please i can get Ajax Content to work in IE but i am unable to get it to work in Firefox, can anyone please give me a hand
February 17th, 2008 at 22:10
Perfect !!
This saved my dayy
February 19th, 2008 at 01:31
Smoothbox (and Thickbox) are the best clones of Lightbox!
Thanks for sharing Mr. Popoff
February 21st, 2008 at 01:50
this is a great script, but i have one problem. if the browser window is vertically smaller than the smoothbox window, one can keep scrolling down indefinitely. is there a way to fix this? thanks!
February 26th, 2008 at 11:15
Hi there,
i use form elements in a hidden div. The form recognize that there are elements (select boxes, text input and so on …) but doesn’t save the entered values if you cklick on close of the smoothbox. Is there a way to save the entered values in smoothbox?
March 6th, 2008 at 07:27
THE BEST SCRIPT forever and ever. Great!
Thanks so much!
El script es excelente la verdad te pasaste!
March 8th, 2008 at 12:34
[...] http://gueschla.com/labs/smoothbox/ [...]
March 10th, 2008 at 19:42
There is a problem for me while using this script. The page has a flash movie embedded on it. I think that the problem. When i scroll the content everything messes up. I’m trying to display an iframed content.
March 21st, 2008 at 21:15
How can i put flash in smoothbox ?
will i have to link with html page or direct with swf file?
can anyone provide me the code?
any help would be really appreciated it.
thanks
March 26th, 2008 at 21:46
Great idea porting this over to use the mootools library. There are some issues with flash embedded content and cross browser issues with IE6 (Surprise!) though. Honestly, not trying to knock your work, but I think the CSS component of this should mimic the original thickbox CSS as closely as possible. Having WC3 approved 100% valid CSS is great, but just not practical. Them’s the breaks.
March 26th, 2008 at 22:36
Aaron > I used flash content in the smoothbox several times, and no problems, on high traffic production sites with all browsers. I guess you have to check your code
March 26th, 2008 at 22:50
tahir > Just add the embed element with any method (ajax, inline, iframe …), or use swfobject
March 26th, 2008 at 22:57
syzygy > No fix for the moment
ray > Yes thats normal, if you want the form to be submitted in the smoothbox, the simpliest way is to use the iframe. But with some lines of JS, you can do this with AJAX too.
March 27th, 2008 at 18:15
[...] Smoothbox : Smoothbox is the thickbox for mootools javascript framework. link [...]
April 1st, 2008 at 10:32
There is a problem when you dynamically load content via AJAX into a div or span. If you have a link with the smoothbox class inside, it is not possible anymore to use the smoothbox, as it seems that the new element is not being regcognized as a smoothbox element. The link is just opened in the current window, and not in a smoothbox. How can this be circumvented? (A sort of “reindexing” of the smoothbox elements would be required I think.)
April 1st, 2008 at 10:33
Just run TB_init() after you AJAX call.
April 4th, 2008 at 21:27
Hi Boris, I added Eric Hanson’s mod
http://gueschla.com/labs/smoothbox/#comment-2114
for select elements and flash movies, although it doesnt seem to work for selects with me, but it does with flash which is a problem. I also added semicolons where they were needed in your script so that scripts like packer etc can pack the smoothbox code, which actually results in the 11.3k script being compressed to 5.2k. If you would like it, please email me and Ill get it to you, and by all means feel free to incorporate it into a future release. We all like compress-able scripts
April 9th, 2008 at 05:08
Hello
How can I open a link like this: /Downhilll/index.php?option=com_phocagallery&view=phocagalleryd
&catid=1:test01&id=1:&tmpl=component
?
Also how must i write the height and weight parameters in this string?
I wanna have a IFrame or scrolling content….
Thanks
April 12th, 2008 at 16:11
Thanks for this great script. I am not here just to say this, I also have a question:
I am using the AJAX-implementation of Smoothbox. Inside the page that is loaded in the Smoothbox there is some javascript. This script isn’t executed though. Is there a way to run the javascript in a Smoothbox once it is opened?
April 14th, 2008 at 02:54
Im loading a photo galery with smootbox into a div with mootools…the problem is that when i click to open smoothbox the picture is open into the window like a normal href
April 22nd, 2008 at 16:24
Hi there,
This is exactly what i need as i am quite familiar with thickbox but i had to have mootools for this widget tha i am using (http://widgets.rabidlabs.net/ratings/v1.4/).
Problem is that this version of the widget uses mootools 1.2
Smoothbox gives me an error with mootools 1.2, i downloaded the full version to be sure and it doesn’t work. What can i do?
thanks
April 22nd, 2008 at 16:33
This is the error i am getting
(new Element(”iframe”)).setProperty(”id”, “TB_HideSelect”).injectInside is not a function
TB_show(”", “http://www.cosmicsoda.com/modules/default/rating.php?height=220&width=400&id=ratable894″, false)smoothbox.js (line 47)
TB_bind(Object $extended=true page=Object client=Object)smoothbox.js (line 34)
[Break on this error] new Element(’iframe’).setProperty(’id’, ‘TB_HideSelect’).injectInside(document…
April 22nd, 2008 at 16:35
Hey, I’ll look into this when I’ll have some time, stay tuned !
April 23rd, 2008 at 18:07
[...] image (les pinailleurs diront que c’est un lien… hem) : http://gueschla.com/labs/smoothbox/ (cliquez sur l’image sous “single image [...]
April 26th, 2008 at 17:19
Je découvre smoothbox,
merci Boris, ça m’a l’air génial !
Mais la version 1.1 de mootools n’est plus d’actualité, j’ai tenté la 1.11 sans résultat.
J’attends avec impatience la nouvelle version de ta smoothbox !
April 28th, 2008 at 18:58
Salut,
J’ai déjà implémenté ta smoothbox, elle est assez sympa !
Par contre, sur IE6, lorsqu’elle passe au dessus d’une balise , on voit la dropdown à travers !
Des petits screenshots :
Avant : http://tinyurl.com/5htox5
Après : http://tinyurl.com/6foaeb
As-tu une solution à cela ?
Merci d’avance !
April 30th, 2008 at 09:38
Any luck with mootools 1.2 ?
May 1st, 2008 at 14:25
Hi, thanks the plug in is great.
a little question.
is it possible to use videos from myvideo.de ?
May 4th, 2008 at 07:19
Wonderful rewrite. Thanks…
IS THERE ANY WAY to pass a url variable to the page opened via iframe? No luck so far. (Thanks!)
May 4th, 2008 at 12:41
I get this error: window.addEvent is not a function from firebug.
I’ve set up this test site, if any could please give me a hint as to what is wrong, I don’t get it?
http://lassemoos.com/moos_gallery/bjkj_test/GALLERY/admin/test.html
May 6th, 2008 at 14:47
Script super sympa, merci !
Même souci que Maxime Brusse.
En plus, lorsque j’ai un objet Flash, que l’on soit avec IE ou FF, il passe en premier plan, par dessus la photographie à afficher.
Sous IE, les menus déroulants sont en premier plan (devant la photographie).
Sous FF, pas de problèmes avec les menus déroulants.
Any ideas ?
Cordialement
Jean CARTIER
May 19th, 2008 at 15:19
Hi,
Firstly, thanks for the great script, used it on a couple of sites now and on the most part it is working fantastic.
However, on pages where I have flash in the content, I used Eric’s fix which works fine, except that the flash doesn’t reappear upon closing the lightbox?
Any ideas?
May 19th, 2008 at 15:28
No problems, figured it out:
This line of the fix:
I added a call to a new “TB_objectHide()” function at line 277 (within the TB_remove() function):
//Hide all flash and “select” objects
TB_objectHide(true);
needed to be set to false instead. I.e:
TB_objectHide(false);
May 25th, 2008 at 05:54
Hello Boris!
thanks for this cool code.
I published on my blog of course a link to this, but also instructions on how to upgrade your code to be used with Mootools 1.2beta (without the compatibility package):
http://digitalemagine.com/wordpress/archives/24
ioustinos, emilie, this might interest you?
cheers
Stefano
May 25th, 2008 at 05:55
[...] you use Mootools, as I do, you can choose between Moodalbox and SmoothBox. They seem quite equivalent. I wish CNET ClientSide would integrate Moodalbox instead of the [...]
May 25th, 2008 at 08:51
Thanks Stefano, great work
May 26th, 2008 at 15:41
Hi there, I have installed this with oscommerce, however the screen goes deem but the login box is not centered, its somewhere on the side, same thing happens in IE7 and firefox, could anyone kindly guide me on how to correct this with maybe a bit of details on exactly what to do…
Secondly, when the page goes deem, my livehelp image (PHPONLINE) does not go deem, This is flash run, how can i make it go deem too.
You guys are great…!!
May 29th, 2008 at 15:43
[...] Smoothbox | More Details [...]
May 29th, 2008 at 17:16
[...] Smoothbox | Страничка [...]
May 29th, 2008 at 18:34
The box works great. My question is, why does the flash banner appear over it? I’d like the smoothbox to be the over everything. make sense?
May 29th, 2008 at 19:33
Adam > http://kb.adobe.com/selfservice/viewContent.do?externalId=tn_15523
May 29th, 2008 at 23:34
and you’re awesome. I haven’t tried it out yet but i’m sure it’ll work. thanks!
May 30th, 2008 at 17:32
Is there anyway to print the box? I added a print button but it comes out as a blank sheet when printed?
Thanks
June 2nd, 2008 at 09:36
On line 292, I comment : $(’TB_HideSelect’).remove();
This solves the select box problems
June 2nd, 2008 at 21:08
Is there a way to html instead of links? Thickbox allows one to do that, but doesn’t seem like smooth box allows that. In my situation, I need to show some dynamically generated content passed by javascript, so using a is essential.
Thanks
June 4th, 2008 at 21:15
Hi,
I’m having a problem with the ajax content. It’s not working. I’ve got the following error: “ajax is not defined”. Am I missing something?
Thanks for the script.
Cátia
June 6th, 2008 at 03:54
How about loading a video instead? but anyway this tutorial is very useful..! thanks a lot!
June 8th, 2008 at 16:09
Hello,
My english is not very good. I placed a login form, but I would like the calling page to reload after login succes. When I click on close, the session is not opened…
Thank you for your help.
June 9th, 2008 at 15:05
In my site stats, I am seeing a lot of 404 errors on “/js/+urlNoQuery[0]+” page, since I have put smoothbox in place…
Is it due to a uncompatibility with specific browsers?
Because I tested my site under IE7 and FF2, and it works great.
June 9th, 2008 at 18:06
@ Boris,
I seem to still be having the problem. Check it out. http://www.exclusivelybimmer.com – Click the contact us. The box is still popping up under the flash movie, though I’ve made it transparent. Any other ideas?
Thanks,
Adam
June 12th, 2008 at 23:32
It looks like the script is broken by Opera 9.5 while it used to work fine with Opera 9.2x, nothing appears anymore.
June 15th, 2008 at 13:39
Hi everybody,
I’ve added Smoothbox to the WordPress ThickBox plugin. I hope that this helps adding this great piece to your blogs.
Cheers,
Christian
June 16th, 2008 at 06:09
This is exactly what I need, but it’s not working with the new MooTools 1.2. Any plans to update it?
Thanks! Great work!
June 16th, 2008 at 17:38
sorry guys, the link is http://www.exclusivelybimmers.com
June 17th, 2008 at 02:24
Great product. One question – Is it possible to change the caption of an iframe when linking from one iframe to another?
The title bar is not rewritten when I pass a new page to the iframe, from an anchor tag with the title attribute in place, from an already open iframe.
Any help appreciated.
Thanks,
Kurt
June 18th, 2008 at 10:51
For everybody who needs to load the Smoothbox link via Mootools AJAX.
You just have to execute TB_init(); again like:
[...]
onComplete: function() { TB_init(); }
[...]
Then it works fine.
BTW: GREAT WORK!
Greets from Hamburg
June 22nd, 2008 at 23:00
Hi,
I found it not working with MooTools 1.2, so I did some editing resulting in:
(don’t know if I edited anything else in the past, should work with other elements to (using copy instead of moving)). I couldn’t find your mailaddress on your site, so I post the code here. I hope it’s useful for someone.
[...]
June 23rd, 2008 at 12:09
Hi Martin.
Thx for you contribution.
I made an updated version of smoothbox for mootoos 1.2 several days ago, I just took the time to make it public.
@ Oliver : The new version works with Opera 9.5
June 26th, 2008 at 09:11
[...] prettyPhoto, Prototype Window, RoeBox, Shadow Box, Slightbox, Slightly ThickerBox, Slimbox, Smoothbox, SubModal, Suckerfish HoverLightbox Redux, SWFbox, Thickbox, TinyBox, YUI based lightbox [...]
June 29th, 2008 at 11:36
[...] Smoothbox | detaylar [...]
June 29th, 2008 at 23:29
[...] Enlace / Peso: 15kb / Framework: jQuery / Descargar / Otras versiones: Slightly ThickerBox , Smoothbox, [...]
July 7th, 2008 at 10:14
Bonjour,
j’utilise smoothbox pour aficher un pdf. Le pdf s’affiche bien mais pas la barre de titre avec le close. il semblerait qu’elle soit bien là mais cachée car quand je passe la souris à l’endroit ou doit se trouver le close, le pointeur se change en main. Comment faire pour l’afficher ?
Merci
July 10th, 2008 at 14:12
Hello Boris,
great work, thanks so much! I wonder if you still read the comments here.. I would have liked to e-mail you directly, but I couldn’t find your mail address.
Anyway, I would like to kindly ask if it would be possible to implement the possibility to use percent based sizing like it has already been done for the Thickbox (see here: http://codylindley.com/thickboxforum/comments.php?DiscussionID=381&page=1#Item_0)? That would be so great and would make Smoothbox the perfect bet in combination with the Modx_CMS…
Any answer would be greatly appreciated! Thanks in advance, Philipp
July 13th, 2008 at 13:36
[...] Smoothbox [...]
July 15th, 2008 at 22:53
Very usefull thank you im very glad !!
July 15th, 2008 at 23:22
Bonjour,
J’ai lu tous les posts ici et ailleurs, mais je ne parviens pas à mon but :
j’ouvre une box dans une iframe avec un lien dans celle-ci. Je voudrais que ce lien ouvre une autre box (iframe également), mais à la place de la précédente, pas dedans ni en dessous etc…
J’ai presque réussi avec TB_show mais le problème reste la suppression de la première box.
Si quelqu’un est passé par là… je vous remercie d’avance
July 19th, 2008 at 03:12
Hi!
the plugin in working fine in safari but is open in new window in firefox and IE7. Does anybody can help me with this problem?
thanks,
Morgan
July 21st, 2008 at 17:39
Hello
Thanks for the script.
I need to display a popup right when the page is loading.
For that I use the following script :
TB_show(”caption”,”reference.html”);
It pop ups correctly but the opacity layer is then fixed when I scroll down the window…
Could anyone help me ?
Thx
Fabien
July 27th, 2008 at 10:48
Boris,
First of all I’d like to say thank you for creating Smoothbox, the compliant CSS is really a big bonus!
I do have one quick question though. I wish to cut down the MooTools library to as small as possible (using the core builder).
So far I have worked out I can cut: “Utilities – JSON”, “Utilities – Cookie,” “Utilities – Swiff” and “Request – Request.JSON” without any problems. I can also cut the rest of the “Request” components if I don’t mind loosing AJAX.
Is there anything else that can safely be cut from the MoolTools library? Thank you in advance for your help ^_^
July 30th, 2008 at 17:54
Bonjour à tous !
Je ne suis pas expert en JS, mais j’utilise l’excellent SMOOTHBOX de Boris. Seulement voilà. Je voudrais récupérer une variable (jusqu’à présent je faisais dans la tradition en la passant par $_GET ou $_POST) dans l’iframe de la smoothbox…
En clair, je cherche à afficher un contenu dans l’iframe qui est issu d’une SGBD MySQL et extrait de cette SGBD en fonction de la variable (l’id en l’occurrence).
Quelqu’un aurait-il une idée ??
Merci d’avance
August 3rd, 2008 at 15:41
[...] (Web Sitesi) (Download) 7-) SmoothBox (Web Sitesi) (Download) LightBox ++ (Web Sitesi) (Download) [...]
August 9th, 2008 at 17:00
Great Work!
Works as good as Thickbox I used before. But Smoothbox is CSS2.1 valid.
Thank’s for sharing!
August 12th, 2008 at 06:07
Thanks for the script.
I had some trouble passing parameters for use in iframes. Looks like the match was not catching correctly to get the baseURL if a ? is present. I grabbed the code from thickbox and seems to work ok.
// check if a query string is involved
//
//var baseURL = url.match(/(.+)?/)[1] || url;
var baseURL;
if(url.indexOf(”?”)!==-1){ //ff there is a query string involved
baseURL = url.substr(0, url.indexOf(”?”));
}else{
baseURL = url;
}
August 13th, 2008 at 14:19
is there anyway to load an image gallery in a iFrame but when clicked not only get the iFrame but the whole browser screen darkened by the thickbox/ smoothbox?
August 13th, 2008 at 14:21
janus > Yes, http://developer.mozilla.org/fr/docs/DOM:window.parent
August 14th, 2008 at 16:33
The updated version of smoothbox is creating a solid (non-transparent) overlay in IE7 only. Is this something that could be fixed by reverting to your older version? And would I also need to revert to an older (1.1/1.11?) version of mootools as well?
August 14th, 2008 at 16:34
corin > Yes, yes
August 14th, 2008 at 18:12
thank you. however, after more testing, it seems the problem is only occurring on my php (linux) host, and not my normal static server. i created a “smoothbox test site” and uploaded identical versions to both servers – the overlay just bombs on the php server.
i can’t imagine you would have any idea why this might be?
August 16th, 2008 at 12:33
Hi,
Before I start try to use your wonderful tools in my website, I would like to know if it possible to use it to display a google map using an iframe.
Thanks in advance for your answer.
August 17th, 2008 at 17:21
Salut et merci pour ce script bien pratique!
Un truc me chiffone depuis plusieurs heures… Comment faire un lien dans la frame smoothbox pour que ce lien s’ouvre en lieu et place de l’actuelle.
J’ai utilisé TB_show(), ça m’ouvre bien ce qu’il faut et où il faut, mais ajoute un bloc vide au dessous de la frame!
Une idée?
August 18th, 2008 at 12:10
[...] SmoothBoxとは今流行のJSライブラリを利用してた画像エフェクトの名前です。 [...]
August 18th, 2008 at 14:21
Salut,
il est super ce script, ce qui me plait c’est de pouvoir charger aussi bien une image qu’une page. Le seul hic c’est qu’il ne semble pas prévu de gestion de boutons “suivant” et “précédant” pour les groupes de pages ou bien les groupes combinés d’images et de pages. C’est vraiment dommage.
Je suis en train d’analyser ton script afin de pouvoir implémenter cette fonctionnalité.
August 18th, 2008 at 14:38
saturnino > Si, la navigation via le clavier est géré, via les touches > et < , mais sur clavier US (tout comme le thickbox original). Si tu veux utiliser les flèches à la place en effet ça prend 2 secondes à modifier
liliwol > Tu es obligé de passer par du JS en utilisant le mot clé “parent” , http://developer.mozilla.org/fr/docs/DOM:window.parent
greg > Yes
August 18th, 2008 at 15:33
Boris je ne suis pas sûr que tu ai compris mon problème:
Je souhaite passer d’iframe en iframe avec le même principe qu’un groupe d’image.
August 19th, 2008 at 11:15
Boris > Pourrais tu expliquer les paramètres de la fonction TB_show() stp? (Juste le paramètre rel en fait.)
Pour le mot clé parent, je ne vois pas trop où et comment l’utiliser…
J’ai essayé du window.parent.TB_Show(), du window.parent.location.href, etc.. mais ça ne va pas.
August 20th, 2008 at 21:48
Hi,
Smoothbox doesn’t work with Safari4 Developer Preview on Mac OS X (v10.4).
If I click on a smoothbox-Link, the loading animation appears, the site is “disabled” for user actions. But the content won’t show up and I’m not able to abort . You can just reload the site to escape from this situation.
Is there a solution?
Thanks in advance,
Stephan
August 26th, 2008 at 07:42
[...] Smoothbox is the thickbox for mootools javascript framework. [...]
August 26th, 2008 at 22:20
is there api that lets me open not through href ?
August 28th, 2008 at 15:32
I think I noticed a small bug in the demos. If you click outside the content area while the pictures (or whatever content) is still loading and the progress bar is visible, the content area and the shading is removed while the progress bar remains visible.
Looks cool. Thanks,
Ozgur
August 30th, 2008 at 07:52
Thank you kindly for making this script available. It works wonderfully.
September 3rd, 2008 at 11:07
I’m puzzled by the first line of TB_bind:
function TB_bind(event){
var event = new Event(event);
// do stuff with the *new* event object
}
Why do you create a new event object which wraps the old one?
Thanks,
tom
September 3rd, 2008 at 11:12
To add the Mootools Event methods to the native browser event object. But since the event is added with Mootools’ addEvent, it’s useless now (the event object has already the mootools methods). I guess It was necessary with older versions of mootools.
September 5th, 2008 at 14:39
I needed a way to do some execute some specific action before showing the popup. This can be achieved by adding a new parameter to the url and read it in TB_show:
var onBeforeShow = params['onBeforeShow'];
Then, if it exists, the parameter will be evaluated before calling TB_showWindow(), e.g.:
var handlerFunc = function(){
TB_position();
if (onBeforeShow) {
eval(onBeforeShow + “(’TB_ajaxContent’)”);
}
TB_showWindow();
};
If onBeforeShow=alert then the code to be exeucted is ‘alert(’TB_ajaxContent’)’. A specific javascript function could then be used to edit the div, add additional stuff, or do anything you like.
September 8th, 2008 at 23:35
Thank you so much for this wonderful plugin.
September 11th, 2008 at 21:42
Great code!!! Which parts of mootools do I need? You had that informations for your old version but you dont give them for the new version ._. and I dont know which mootools parts I need.
September 12th, 2008 at 09:49
[...] gång man skulle öppna en bild så ploppa den upp i en popup eller tog över hela sidan. Detta har Smoothbox, Thickbox och Lightbox löst genom ett javascript som tonar ner hela sidan och öppnar bilden [...]
October 12th, 2008 at 05:02
[...] Mostrar HTML basado en Smoothbox [...]
October 12th, 2008 at 18:16
It’s possible to use this script with generated PHP GD (watermark) images ?
Ex.: When I show images like this -> [...]watermark.php?scr=someimage.jpg[...]
(
smoothbox works ONLY if I use IFRAME
What can I do when I want to use smoothbox with watermarked ON FLY images ?
October 13th, 2008 at 23:36
Great posting and article. One question
How do I launch popups from flash using Smoothbox? We currently use thickbox and mootools but get incompatibilities.
current ActionScript
ExternalInterface.call(”tb_show”,”Alaska”,”salesrep.aspx”,false);
Would would need to change to run this through SmoothBox?
Thanks!!!!!!!
October 15th, 2008 at 02:43
[...] Smoothbox Smoothbox is the Mootools conversion of Thickbox, a script running on JQuery.For the description and the features, you can go to Thickbox’s website, as they are basically the same.The main difference from a user point of view is that I’ve added some effects when the box shows up and on scroll. [...]
October 15th, 2008 at 16:14
Having a problem in Firefox 2 and IE7 – If you have a link to an image that does not exist, the loading gif shows up along with with the modal background. However, clicking off of it to stop it leaves the .gif on the screen whereby I would assume it should become hidden again. Relatively minor because it’s obviously more important that your iamges appear
Great work, love that it’s compatible with mootools.
October 20th, 2008 at 15:14
[...] Explorer 6! Misteri misteriosi…Comunque, alla ricerca di una soluzione, ho scoperto invece Smoothbox, leggero come Thickbox da cui deriva, ma che si appoggia ad un’altra libreria… e [...]
October 23rd, 2008 at 16:47
A signaler un petit problème avec Mootools 1.2.1 et SmoothBox (enfin cette version) avec IE 7 lors de l’utilisation d’un contenu autre qu’une image…
Suis-je le seul à avoir ce bug ??
October 26th, 2008 at 23:50
Hi, I found smoothbox through another application and it looks great!
I have a problem in Firefox-Mozilla though.
In some pages on my site, when i click a button the seethrough pixels fills the screen but the box popups up at the bottom of the screen hidden from the viewer. If i scroll down using the middle button i can “catch” it a bit, but then it just hides again under the taskbar.
I cant find why it is doing that…I’ve been trying 4 hours to figure it out
Can someone tell me why ?
Thanks
October 28th, 2008 at 12:32
Hi there,
just a quick one, in IE7 the background is solid black? not transparent?
any ideas
cheers
ben
October 31st, 2008 at 12:10
Bonjour et merci pour ce script !
Je rencontre un bug avec IE7 : j’appuie sur mon bouton “contact” et le formulaire n’apparaît pas, par contre, ma page glisse vers la droite de l’écran…
Sur Firefox le comportement est normal, le formulaire apparaît sur fond grisé après la transition.
Je suis sur wampserver windows
November 3rd, 2008 at 12:02
[...] Smoothbox [...]
November 3rd, 2008 at 15:06
Thnx for this one, I use it for Iframe-technology
Have one “bug” though: when you use an URL with parameters (like http://mysite.com/document.asp?id=4&test=2)
I appended &TB_iframe=true&…. etc to it, but when your script checks for url.indexOf(’TB_iframe’), it splits the URL on ‘TB_’ which leaves an ampersand as last character on the URL.
I needed also an anchor, which made it unworkable: ?id=4&test=2#anchor&
I solved this in your script as follows:
if (urlNoQuery[0].substr(urlNoQuery[0].length-1,1)==’&’) urlNoQuery[0]=urlNoQuery[0].substr(0,urlNoQuery[0].length-1);
Maybe you should find a permanent solution
November 17th, 2008 at 11:52
This is just too slow in IE7. Same machine, Thickbox/jQuery samples load instantly, these ones here take seconds. Also CPU activity goes way up close to 100% for literally 5 seconds or more while for Thickbox only to 20%. And this is a new Core2Duo laptop. I know jQuery is a bit faster in general, especially in IE but not that much. On the other hand, testing in Chrome works perfectly – very instant and more smooth effects.
November 17th, 2008 at 22:38
A simple workaround for the parameters problem with mod_rewrite. I use it on my cms to add comments for articles.
Add in .htaccess
RewriteEngine on
RewriteRule ^add_comment_([0-9]+)$ addcomment.php?id=$1
generate the links to the iframes like add_comment_1221?keepThis=true&TB_iframe=true&height=440&width=500
(1221 is the value for the id parameter to be passed of course)
read inside the iframe the id with: $_GET[id];
November 19th, 2008 at 12:09
Hi. I’m trying to use smothbox but it’s opening my images in a new window. How can I fix this.
December 1st, 2008 at 22:17
Your script is not working. Either mootools.js is not loaded, or smoothbox, or both. Check the paths. Use a tool such as Firebug to find the bug quicker.
December 10th, 2008 at 22:25
I’ve got the same problem, but strangerly on my Localhost (WAMP running)
it works, and online it opens only the image (no layer effect…)
;-(
An other question: my website works with frame scaffolding so i’m looking for a script which is able to lay the image over all frames… Does anyone know about one like that???
Please write me.
But at least wou’re script is really nice and I think i’ll enjoy it anyway…
best regards your entity
pascal{dot}gujer[at]hispeed(dot)ch
December 21st, 2008 at 05:20
This is great! But…
I see a bunch of requests for a simple way to pass a parameter, but don’t see a clear answer. I tried the thing ‘beermemarge’ wrote, above, but it didn’t help (changing the ‘var baseURL’ code). I couldn’t make heads or tails of some of the other references… not being great at JS.
Any clues you can give me?
My ultimate goal is to pop open a window when someone clicks a radio button or checkbox (or something that looks like one) and have a new PHP-generated form pop up based on the parameter (changing content based on the parameter). I’m using $_GET(’stuff’) to receive the value in the target page.
Thanks!
December 26th, 2008 at 20:43
[...] диалоговых окон с фотографимяи или картинками. Страничка [...]
December 27th, 2008 at 13:47
Please i need help!
I use smoothbox but i need to use the “OnLoad” event for loading a Flash animation while loading page….please help me..how should i do?
Thank you
January 13th, 2009 at 11:18
[...] : Standart lightbox örneğine benzeyen bir lightbox örneği. Web Sitesi ‘ni ziyaret edin. Download etmek için [...]
January 16th, 2009 at 12:44
Hi,
(sorry for my bad english)
First I really like this gallery, so, thanks to the dev who work on !
Well, I just wanted to add a link under some images in the gallery images to refere to them …
I tried, and, it works, so I post my “how to” :
First, open smoothbox.js and your HTML file (ex: index.html).
In your HTML file copy/paste the “a href” as in this website explain, so :
Ok, now, just add ‘name=”www.celavi.fr” ‘ in the ‘a href’ , like this :
That’s all for your HTML file.
Then, in the smoothfile.js file, go to the line 33, delete the “caption var” line, and replace by :
// get caption: either title or name attribute
var caption = this.title || “”;
// get link: either title or name attribute
var lien = this.name || “”;
‘lien’ means link in french, so you can replace by “linkUrl” or any other variable, BUT NOT ‘link’ !
then, in the line 39 (around), you add again your new variable, like, this :
TB_show(caption, lien, this.href, group);
ok ?
Same manipulation on line 45.
Go to line 89, and under :
caption: “”,
Add
lien: “”,
Go to line 101, and under :
caption: image.title,
Add
lien: image.name,
In line 176, you should get this :
Now, add your new variable, like this :
And last point, in line 177, find something like :
“” + caption + ”
And replace by :
“” + caption + “” + “” + lien + “
Ok, that’s all, I hope I didn’t forget anything … and hope this help !!!
thx,
bye bye
January 28th, 2009 at 13:48
I’m trying to use a login form opening it in a Smoothbox (I’ve followed your example and it works correctly): I’m encountering a lot of problems, as I’d need to close the Smoothbox window when clicking the submit button, or better to close the Smoothbox if the login is successfull (I’d try to manage this with an AJAX script that should close the window on success).
Can you please show me some code to close the window without a closing link?
Thank you in advance
February 2nd, 2009 at 13:14
This is driving me crazy but how come I can’t get it to work in IE or Safari? It seems just to work in Firefox? I am using a strict doctype and I have all the components. It’s currently at http://www.iprontoweb.com/eco . Any suggestions?
Look forward to your help,
James
February 2nd, 2009 at 13:15
oh, it’s the comments button.
February 2nd, 2009 at 13:16
sorry I mean contacto!
February 2nd, 2009 at 14:58
It’s ok, I’ve solved the issue, just my own lazy scripting error!
February 5th, 2009 at 12:24
[...] Name:Smoothbox [...]
February 10th, 2009 at 20:58
I just tried Smoothbox, but find I can no use it without implementing few modifications to suit design concept:
- fully disable page background opacity effect and animations;
- make image container dragable;
- to open the container of theSmoothbox up on the page(or just near the top) instead of having it centered vertically.
Dont know how to adjust for this. I think it very easy. Any help?
Thanks
February 19th, 2009 at 22:28
I’m having trouble with IE6 (no big surprise) and SSL. When you click a link to open a smoothbox a security error pops up suggesting that the page is no longer secure. This does not happen in Firefox. Does anyone have a suggestion on how to correct this problem?
February 20th, 2009 at 16:47
Hi,
Thx for that great “box” but I got a strange problem when I’m use it in Firefox 3, it works great in IE 7.
The problem with firefox is that won’t create an iframe, so when I click on the img Firefox shows it under my page, so there’s a big blank under the “conteneur” and I have to scroll down to see the img, and the funny way of it, is that it’s work well but not on an iframe.
So please could you help me? Thx
February 28th, 2009 at 19:14
upss add this script
http://gueschla.com/wp-content/themes/default/mootools-1.2-core-yc.js
March 7th, 2009 at 05:35
AWESOME SCRIPT!
March 10th, 2009 at 16:25
Bonjour,
Petit problème avec le INLINE HTML, impossible de transmettre le HEIGHT, donc pas de calcul pour le positionnement en TOP (sauf en copiant le code source depuis firefox sur une nouvelle page html, biiizzzzare). J’ai cependant trouvé la solution en ajoutant à la ligne un “&” devant height à la ligne suivante :
Show
Ce qui donne :
Show
Problème de parse ?
(N’hésitez pas à me répondre sur mon mail si besoin)
March 10th, 2009 at 16:27
Bonjour,
Petit problème avec le INLINE HTML, impossible de transmettre le HEIGHT, donc pas de calcul pour le positionnement en TOP (sauf en copiant le code source depuis firefox sur une nouvelle page html, biiizzzzare). J’ai cependant trouvé la solution en ajoutant à la ligne un “&” devant height à la ligne suivante :
<a href="#TB_inline?height=300&width=300&inlineId=myOnPageContent" title="#" class="smoothbox">Show</a>
Ce qui donne :
<a href="#TB_inline?&height=300&width=300&inlineId=myOnPageContent" title="#" class="smoothbox">Show</a>
Problème de parse ?
(N’hésitez pas à me répondre sur mon mail si besoin)
March 10th, 2009 at 23:26
Gostaria de agradecer, me ajudou muuuito!!!
Translate: I only wanna thank you. You helped me very much!!!
March 12th, 2009 at 17:17
YEAH!!!!! You guys officially rock for creating this script. I’ve been searching and had loads of trial and error!
Thanks sooo much!
March 20th, 2009 at 23:37
This stuff is great. I’ve seen a few alternatives but your examples with all the content variations is even better.
I can’t see how you make the call to an html document work in Wordpress.
HTML
<a href=”#TB_inline?height=300 is your example, but how did you setup the page? Is it a private page and you are using permalinks? Did you just create a static page and save it to the root dir and call it from there?
Keep up the great work.
March 21st, 2009 at 01:12
Do you have a guide on how to install it? I can think of a few ways but knowing the simplest direct would be great. Keep up the great work.
March 21st, 2009 at 13:11
Can you pull a page with SSL into the smoothbox?
April 3rd, 2009 at 08:57
Bonjour,
j’utilise noobslide avec slimbox et ca fait un conflit du genre : Element.Storage has no properties , mootools…2-core.js (ligne 190).
Que dois-je faire?
merci
April 3rd, 2009 at 09:00
Bonjour,
j’utilise noobslide avec smoothbox et ca fait un conflit du genre : Element.Storage has no properties , mootools…2-core.js (ligne 190).
Que dois-je faire?
merci
April 8th, 2009 at 18:14
I tried the fixes that have been posted here to handle Safari’s cache problem with the iframe version. All it does for me is disable the javascript effect and open in the full window (not the popup).
Is there any new information on why Safari screws up the iframe technique when the page is reloaded? I want to use links within the popup that take users to another page within the same popup. The ajax method doesn’t seem to handle this.
Thanks for your help. This is a great script if it will work consistently in all major browsers.
April 20th, 2009 at 02:42
Hi,
I’m having a little bit of trouble with smoothbox and mootools. When the smoothbox pops up the menu sort of leaks through so that the buttons are still clickable. I would appreciate any help…also if there is some sort of fix please send it to my email…if thats ok
Thanks!
April 26th, 2009 at 13:36
Thank you … this tutorial has me very helped.
May 5th, 2009 at 19:41
Bonjour.
J’ai rendu mon blog compatible aux normes W3C et le validateur me met tout en vert, sauf pour la partie CSS du plugin “Ajax edit comments” à cause de l’application AJAX Thickbox, qui a un mauvais code CSS. J’ai donc deux possibilités: soit désactiver le plugin mais ce serait fort dommage pour les lecteurs, soit corriger les erreurs du CSS.
Après une recherche sur le Net, je tombe sur ce forum: http://ajaydsouza.org/index.php/topic,25.0.html où un membre conseille de remplacer Thickbox par Smoothbox qui, lui, est valide CSS. Super je me suis dit !
Mais… J’ai beau chercher, je ne vois pas du tout comment remplacer Thickbox par Smoothbox ? Où dois-je agir ? Si vous pouviez m’aider, ça me dépannerait vraiment !
Merci d’avance.
May 13th, 2009 at 23:49
Hi,
I was wondering if you could tell me how could I fix the brief appearance of scrollbars when smoothbox content is loaded. See http://www.igorbrezhnev.com/clients/siterev3/ – when one of the thumbnails on the main page are clicked the browser window shows scrollbars for a brief moment and then shows the smoothbox content.
Thanks!
May 27th, 2009 at 09:19
Bonjour,
D’abord, Bravo, c’est la plus belle des “box” que j’ai vu jusquà maintenant..
Ensuite, deux questions me taraudent :
- Avec quelle version de mootools le script fonctionne t-il ?
- Quelle est la méthode, la syntaxe pour ouvriri une smoothbox à l’ouverture d’une page ?
Merci d’avance
May 28th, 2009 at 22:38
Hello Boris. I experienced that if I use [a href="#" class="smoothbox"]link[/a] AFTER TinyMCE editor, the class not works, simply works as a normal link.
However, if I hold the same link BEFORE TinyMCE editor, your class works fine.
What could be doing TinyMCE that your class not works fine?. Is there a modification to achieve this?
Thanks!!
May 28th, 2009 at 23:26
I highlight that only suceed in IE7 (as always…)
May 31st, 2009 at 16:09
А если не тайна, автор блога откуда родом?
June 22nd, 2009 at 21:31
I’m using Smoothbox and MooTools to create the overlay effect when one clicks an image/link to open up a new “page/overlay.” It works great with HTML pages but there is a problem when I link to a PDF. I do get the “overlay” effect where the background is grayed out but the “top gray bar with the CLOSE link” is not there. As a result, I have no way of closing out the overlay to get back to the main page.
I have a similar problem with the overlay when I try to link to a HTML page where I have a PowerPoint presentation converted into a movie with Camtasia.
Any ideas what might be going on? Has anybody else have this problem where the gray bar with the CLOSE does not show?
Thank you in advance.
Linda
June 23rd, 2009 at 20:42
[...] Smoothbox is another extremely light-weight lightbox script. The setup is quick/easy – it’s not bulky or clunky, and only requires 2 files to operate (css & js, and images of course). [...]
June 29th, 2009 at 02:31
Я подписался на вашу РСС ленту, но посты почему-то в виде каких-то квадратиков
Как это исправить?
June 30th, 2009 at 21:00
Hi,
I seem to be having a problem with iframes in Firefox 3. When the iframe starts to opem you briefly see a snap shot of the previous page. The loader image does load but is shown for only a split moment between this odd image repeat and the correct page loading.
This does not happen in IE and it does not happen in Chrome.
Any ideas?
July 6th, 2009 at 08:33
hi,
i would like to use a smoothbox on an image map. I tried it with the normal explanation (), but this don’t works.
can me help somebody?
so long
lars
July 6th, 2009 at 08:39
ahh i have found a solution! i’ve added some lines
at the beginning of the file:
function TB_init(){
$$(”a.smoothbox”).each(function(el){
el.onclick = TB_bind
});
//new code
$$(”area.smoothbox”).each(function(el){
el.onclick = TB_bind
});
}
July 6th, 2009 at 23:39
This is a great tool, thank you! My question is I basically need to click on the link, have the pop up come up and then load the page. I need to be able to see any errors on the pop up page as they are displayed (I keep the buffer flushed so content is displayed to the new page as the php script runs). The current way it’s working is the whole page is loaded then the pop up comes up with all the content all ready displayed. Thank you.
-Dv
July 8th, 2009 at 22:57
I love this application, I just wish it would load faster upon clicking. Any ideas on how to do this? The smoothboxes on my webpage load very slow!
July 13th, 2009 at 12:23
[...] Smoothbox [...]
July 14th, 2009 at 03:35
[...] Smoothbox [...]
July 15th, 2009 at 02:55
[...] Smoothbox, Thickbox for mootools » Gueschla.com [...]
July 15th, 2009 at 10:30
[...] Smoothbox | Demo | [...]
July 16th, 2009 at 10:15
I love this application, I just wish it would load faster upon clicking. Any ideas on how to do this? The smoothboxes on my webpage load very slow!
July 22nd, 2009 at 12:39
Hello,
I’m trying to remove the slide from bottom left to center effect when pressing next or previous link but didn’t succeed.
Could someone one tell how to do that ?
Regards
July 23rd, 2009 at 21:59
I am assuming the proper way to create a smoothbox window from javascript without using a link is to call the TB_show() function passing along the desired variables for caption, url, and rel. Is this the best way to do this or is there another way?
July 30th, 2009 at 09:32
If anyone’s still struggling with the Safari iFrame cache problem, I found an easy fix on this page: http://codylindley.com/thickboxforum/comments.php?DiscussionID=682&page=1
worked for me… cheers.
August 3rd, 2009 at 15:08
I lobve this work! I used this one so often for great useful things. thanks a lot for this wonderful work! so many website projects could be realized. guys like you keep the webdesign at a high level that matters!
greets from germany
August 3rd, 2009 at 22:36
For anyone who is using this for html content you may run into an issue if you have a query already attached to your url:
http://www.somewhere.com/somfile.aspx?id=123123#TB_inline?height=165&width=365&inlineId=popup_ccv
It will cause the window to not center itself vertically and will throw an error in ie. The fix I came up with:
line 225
replace:
var queryString = url.match(/\?(.+)/)[1];
var params = TB_parseQuery(queryString);
with:
var queryString = url.split(”?”);
var params = TB_parseQuery(queryString[queryString.length-1]);
Not sure if that is the best solution, but it has worked well for me so far.
August 7th, 2009 at 14:07
[...] Smoothbox , Thick box for mootools [...]
August 9th, 2009 at 23:01
Bonjour,
tout d’abord merci pour le script.
Je voudrai que quand on clique sur le bouton Fermer de la smoothbox, ça rafraichisse la page.
Donc j’aimerai intégrer un refresh() après closeWindowButton mais je ne sais pas faire, je ne maitrise pas du tout le javascript.
Est-ce que quelqu’un pourrait m’aider à modifier le code ?
Merci d’avance.
August 14th, 2009 at 23:13
Thanks for such a great script it works really well.
Are there any demos on how to use the Modal version of Smoothbox?
August 28th, 2009 at 13:49
[...] Smoothbox [...]
September 5th, 2009 at 14:01
[...] Smoothbox using MooTools [...]
September 17th, 2009 at 14:32
j’ai essaye le le script smoothbox ca marche très bien , J’ai un p’tit problème je veux passer la viriable $matricule au script detail.php mais j’ai toujours cette erreur
l’erreur est : Notice: Undefined index: $matricule in /var/www/html/lmdst/detail.php on line 3
voici mon script :
matricule
merci a la cooperation
September 18th, 2009 at 19:22
Hi,
First, thanks for this great job
I would like to know how to change the url of the parent window by clicking a link in my Iframe.
I try things like, parent.location(’url’) … but it doesn’t work.
When I click on my link, I want to close the iframe and replace the url of my parent windows.
Please help
Thanks
(french people can answer in french, this is not a problem)
September 24th, 2009 at 05:21
[...] nyroModal prettyPhoto Prototype Window RoeBox Shadow Box Slightbox Slightly ThickerBox Slimbox Smoothbox SubModal Suckerfish HoverLightbox Redux SWFbox Thickbox TinyBox YUI based [...]
September 30th, 2009 at 16:11
i used this,but what i need it to pass data in url
and i inline it doesnt work with me
could u please help
October 8th, 2009 at 13:46
Im using this smoothbox script with mootools in zend framework…..
how to implement it…i got an error like Url match is null…in the line no 225 in smoothbox.js
October 16th, 2009 at 15:44
Are there any demos on how to use the Modal version of Smoothbox?
There is a modal version in thickbox (look at my webpage: http://www.webgrid.com for example)
Is this supported in Smoothbox?
October 20th, 2009 at 12:42
I used milkbox but there is no way to show an iframe. Smoothtool is a very good motool plugin for showing pictures and show other webpages.
Cool
October 23rd, 2009 at 06:46
hi
please let me know how to remove a close option in iframe thickbox
Thank’s
Jignesh
October 28th, 2009 at 15:25
[...] Smoothbox [...]
October 29th, 2009 at 23:24
testing medical devices [url=http://rxdrugs24x7.com/product/tamiflu.html]Order tamiflu[/url] watsonville ca drug rehab centers [url=http://rxdrugs24x7.com/product/ovral.html]health clubs in california[/url] home health care key messages
http://rxdrugs24×7.com/product/aciphex.html
November 6th, 2009 at 16:20
Thanks It’s really great tool
November 16th, 2009 at 12:53
We love your script very much! We work so often with this one. It is lightweighted, it is powerful and it brings all the features we need for nice presentations of images, html content, multimedia data like videos and animations. and it has a well interface for communication with servers (buzzword: ajax). It is a real good base for implementing own ideas like “pimp my smoothbox”!
We love your script!
November 17th, 2009 at 04:52
[...] Smoothbox [...]
December 2nd, 2009 at 22:17
PDF viewing is made possible by jquery and I hope there is a plugin downloadable so wee need not to rely on something else.
December 8th, 2009 at 22:22
Wow, that are very interesst gallerys. Has me very helped.
December 21st, 2009 at 01:29
Excellent work. You have gained a new fan. Please keep up the good work and I look forward to more of the same excellent posts.
December 29th, 2009 at 13:15
Hi, many thanks for the script! Just one request; how do you enable the easing motion that occurs in a jQuery Lightbox when the box initially resizes to accommodate the size of an enlarged image? Is this effect possible in Smoothbox?
Thanks.
January 9th, 2010 at 12:52
hello…………
Hi, many thanks for the script! i am looking for this script from 2days. now i got it. but i am facing one one problem in this. actually i used “iframe example1″; when i am clicked the link image will displaying total page. smoothbox not appearing. i tried a lot. but this is not getting. plz tell me where is the problem in my code.
Thanks.
January 11th, 2010 at 23:11
How can I make the scrollbar disapered when open a popup iframe (url)? It is anoying and my iframe height is fixed.
January 25th, 2010 at 12:59
Hi Boris and thank you for this script. I’d like to ask you a question here. I’m trying to use Smoothbox in my website but in Firefox there seems to be a strange behavior when I click on the link that loads the iframe code. My warp div seems to move to the right and then it returns to its normal position. It happens only in Firefox.
My wrap div is absolutely positioned and I don’t know if that causes the problem.
#wrapper{
width:620px;
height:600px;
padding:0;
position:absolute;
top:0;
left:50%;
margin-left:-310px;
z-index:0;
}
Should I give you a link to my website and take a look of it?
January 27th, 2010 at 03:03
Any easy way to get rounded corners on the border of TB_window?
February 1st, 2010 at 21:17
Thanks so much for the code! Works great and provides a great experience!
I did have one problem that I fixed, and I thought you might want to hear about it…
When launching the smoothbox from a page such as /index.jsp?val=true , the TB_parseQuery method does not the handle multiple query strings well…
you can add this line underneath the var params = { }; statement and it will handle it just fine, without breaking any other functionality
// if the url that we are on contains a query string, then we need to strip the first string out…
query = query.substring(query.lastIndexOf(’?') + 1);
February 13th, 2010 at 00:38
Have you fixed the dialog creating itself outside the form tag? I made some tweaks that I can send if your interested.
February 13th, 2010 at 11:14
[...] Smoothbox Smoothbox is the Mootools conversion of Thickbox, a script running on JQuery.For the description and the features, you can go to Thickbox’s website, as they are basically the same.The main difference from a user point of view is that I’ve added some effects when the box shows up and on scroll. [...]
February 15th, 2010 at 12:27
I get an error-message on your site
http://gueschla.com/labs/smoothbox/ :
” Warning: Unknown(/home/bpopoff/gueschla.com/myShare/myShareWP.php): failed to open stream” …
February 17th, 2010 at 21:32
Thanks a lot. Very Usefull
February 20th, 2010 at 01:35
[...] which caused a few problems with the jQuery scripts already on the site. I went through mootools Smooth Box, Thick Box all with no avail kept coming across a problem. I then did a little reading and found [...]
February 21st, 2010 at 10:51
[...] Smoothbox [...]
February 22nd, 2010 at 14:51
Does it works with google maps ?
I would like to add google maps in a lightbox, in mywebsite…
February 26th, 2010 at 06:33
hii…i hve problem in calling function TB_init(){
$$(”a.smoothbox”).each(function(el){
el.onclick = TB_bind;
});
}
can anyone help to execute that function properly
February 26th, 2010 at 06:36
and when i clicked image it didnt open in smoothbox…
February 26th, 2010 at 06:41
following function created prob m trying alot to execute it $$(”a.smoothbox”).each(function(el){
el.onclick = TB_bind;
});
pls help……….
February 27th, 2010 at 03:04
how do i launch a smoothbox window programmatically?
March 5th, 2010 at 03:40
Hey, I came across this article while searching for help with JavaScript. I have recently switched browsers from Chrome to Firefox 3.2. Just recently I seem to have a issue with loading JavaScript. Every time I go on a page that needs Javascript, my computer doesn’t load and I get a “runtime error javascript.JSException: Unknown name”. I cannot seem to find out how to fix it. Any help is very appreciated! Thanks
March 12th, 2010 at 03:42
[...] Smoothbox [...]
March 12th, 2010 at 04:27
[...] Smoothbox [...]