1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

ThickBox 0.4

Discussion in 'Plugins' started by Nick, Nov 30, 2009.

  1. Nick

    Nick Well-Known Member

    Version: 0.4
    Author: Nick Ramsay
    Created: 2009/11/28
    Last Updated:
    Tested on: Hotaru 1.1.1 ~ 1.3.0
    Plugins Required: None
    Plug & Play: Yes
    Supported: Yes

    This plugin includes ThickBox 3.1

    "ThickBox is a webpage UI dialog widget written in JavaScript on top of the jQuery library. Its function is to show a single image, multiple images, inline content, iframed content, or content served through AJAX in a hybrid modal."

    By itself, this plugin doesn't do anything, but other plugins can use it to display images, videos and other media. One such plugin is Video Inc.

    1. Upload the "thickbox" folder to your plugins folder. Install it from Plugin Management in Admin.

    To test it, put an image in your theme's images folder and place this somewhere in your theme, changing IMAGENAME.JPG to match your image:
    <a href="<?php ehco BASEURL?>content/themes/<?php echo THEME?>images/IMAGENAME.JPG" class="thickbox">CLICK HERE</a>
    If it doesn't work, clear the css/js cache from Admin -> Maintenance, then view the page again and do a hard refresh (usually CTRL+F5) to force inclusion of the javascript and css files.

    Revision History
    v.0.4 2010/07/10 - Ties - Added position fix (as posted here)
    v.0.3 2010/03/04 - Nick - Removed IE6 hacks which caused IE problems when CSS is minified
    v.0.2 2010/01/02 - Nick - Updated for compatibility with Hotaru 1.0
    v.0.1 2009/11/28 - Nick - Released first version

    Please click "Rate Thread" and give this plugin a rating. Thank you.


    Attached Files:

    Last edited by a moderator: Feb 6, 2010
    zigstonk, baadier and melony like this.
  2. Nick

    Nick Well-Known Member

    Updated: v.0.3 2010/03/04 - Nick - Removed IE6 hacks which caused IE problems when CSS is minified - This fixes the bug in IE which showed videos from the Video Inc plugin at the bottom of the page instead of overlaying the page.
  3. baadier

    baadier Well-Known Member

    My thick box for some reason shows at the top of the page instead of the current screen position? Any ideas on how to fix this guys?
  4. Nick

    Nick Well-Known Member

    First, see if it works with Debug mode on. If not, then the problem is caused when all the JavaScript files are merged together. If that's the case, try moving the Thickbox plugin into a different position in the plugin order, then clear the CSS/JS cache from Admin -> Maintenance and try again.
  5. baadier

    baadier Well-Known Member

    The plugin works with debug on, so i tried uninstalling and then installing it again and clearing the cache and it still appears at the top of the screen as opposed to the current screen position.
  6. Nick

    Nick Well-Known Member

    Did you try changing its position in the plugin order? If that doesn't work, then it's most likely a clash with some other JavaScript on the page. I see you've got AddThis and Meebo JavaScript there, too.
  7. baadier

    baadier Well-Known Member

    Ive just added the Meebo, but should i lower its potion or potentially move it above something else that uses the javascript?
  8. baadier

    baadier Well-Known Member

    Ive tried moving the thick box, its now second just beneath Sb base. I remember reading in another post that its inadvisable to have anything before sb_base. I also made sure i cleared all the cache and did a hard refresh in my browser.Any ideas on what could be wrong?
  9. Nick

    Nick Well-Known Member

    When I visit your site with Firebug on, everything freezes and I get an "Unresponsive script" error. If I were you, I would remove the JavaScript for AddThis, Meebo, etc. and then start disabling plugins (and clearing the cs/jss cache) until I could identify the cause.

    Also, test it on other browsers.
  10. ties

    ties Theme & Plugin Development

    you should change the css to fixed instead of absolute
    add this to the css:
    #TB_overlay, #TB_window {
        position: fixed !important;
    Edit: Oh and im getting 11 times this error:
    and a couple of these:
    Last edited: Apr 22, 2010
  11. nothingman

    nothingman Active Member

    Wow, just upgraded to 0.3 and I'm having the same problem that baadier is having.


    Ties, which css files - my template css file?

    EDIT: I hard refreshed my browser and cleared all the cache folders too.
    Last edited: Apr 23, 2010
  12. nothingman

    nothingman Active Member

    Phew that fixed it. But what errors are you talking about ties?
  13. ties

    ties Theme & Plugin Development

    i guess to the thickbox.css...
    i dont understand, i just gave a fix for the position problem...
    but im glad its fixed
  14. zigstonk

    zigstonk Donor Donor

    I can't get this fix to work properly in IE8 when using either the Hotaru Light or Shibuya theme. However, when I used the Default theme, it works fine for IE8 (as well as FireFox).

    Is this somehow related to Nick's post (below)?

    In IE8 (after the code update), my videos are also appearing at the bottom of the page ... but with a LOT of black appearing between the bottom of the footer and the video lightbox. (I'm using the Hotaru Light theme, but activated/tested the other two to see what would happen).

    Anybody have any ideas on how to fix this? As always, many thanks.


    Update: Back to this one today...in IE8, I'm seeing the following error message on the page (after the code update):

    Webpage error details

    User Agent: Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 5.1; Trident/4.0; Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1) ; .NET CLR 2.0.50727; .NET CLR 1.1.4322; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729)
    Timestamp: Mon, 21 Jun 2010 15:48:49 UTC

    Message: 'document.getElementById(...)' is null or not an object
    Line: 13
    Char: 20
    Code: 0
    URI: http://coolestcarpool.com/cache/css_js_cache/hotaru_js_1276723590.js

    Thanks for any help on this.


    Edit 6/22 - Apologies for posting in two threads. Seems this is more of a troubleshooting issue for me, so see my updates in this thread: http://hotarucms.org/showthread.php...ideos-with-Video-Inc/page2&highlight=thickbox
    Last edited: Jun 22, 2010

Share This Page