WordPress.org
Get WordPress

Plugin Directory

Changeset 605631


Ignore:
Timestamp:
09/29/2012 04:57:12 AM (13 years ago)
Author:
attosoft
Message:

NEW: Mobile support for small-screen devices such as iPhone, Android, Symbian, BlackBerry and Windows Phone

  • Improved resizing algorithm
    • Before: ThickBox set fixed 150px margin around an image however small the browser window may be
    • After: ThickBox set fixed 30px margin around ThickBox window
      • Uses jQuery(window).width()/height() instead of tb_getPageSize() to remove scroll bar width
  • Removed temporary workaround for small screen (See [604041])
    • Before: ThickBox did nothing when browser windows is smaller than 480px
    • After: Uses zero margin around ThickBox window when browser windows is smaller than 480px
File:
1 edited

Legend:

Unmodified
Added
Removed

  • auto-thickbox-plus/trunk/thickbox.js

    r605624 r605631  
    6464
    6565function tb_click(){
    66     var SMALL_WIDTH = 480;
    67     var SMALL_HEIGHT = 480;
    68     var pageSize = tb_getPageSize();
    69     if (pageSize[0] <= SMALL_WIDTH || pageSize[1] <= SMALL_HEIGHT) {
    70         return true; // do nothing (i.e. the link will be opened normally)
    71     }
    72    
    7366    if (document.getElementById("TB_window") !== null) {
    7467        jQuery(document).unbind('.thickbox');
    … …  
    748741
    749742function tb_reposition(params) {
     743    jQuery("#TB_window").width(jQuery(window).width()); // ThickBox windows height will be reset to appropriate value
     744
     745    var winBorderSize = tb_getSize(jQuery("#TB_window"), "border");
     746    var winSize = tb_getSize(jQuery("#TB_window"));
     747    var imgMarginSize = tb_getSize(jQuery("#TB_Image"), "margin");
     748    var imgSize = tb_getSize(jQuery("#TB_Image"));
     749
     750    var SMALL_WIDTH = 480;
     751    var SMALL_HEIGHT = 480;
     752    var pageSize = tb_getPageSize();
     753    var winMargin = (pageSize[0] <= SMALL_WIDTH || pageSize[1] <= SMALL_HEIGHT) ? 0 : 30;
     754
    750755    // Resizing large images - orginal by Christian Montoya edited by me.
    751     var pagesize = tb_getPageSize();
    752     var x = pagesize[0] - 150;
    753     var y = pagesize[1] - 150;
     756    var x = jQuery(window).width() - (winBorderSize[0] - winSize[0] + imgMarginSize[0] - imgSize[0]) - winMargin;
     757    var y = jQuery(window).height() - (winBorderSize[1] - imgSize[1]) - winMargin;
    754758    var imageWidth = params['width'] ? Math.min(params['width']*1, imgPreloader.width) : imgPreloader.width;
    755759    var imageHeight = params['height'] ? Math.min(params['height']*1, imgPreloader.height) : imgPreloader.height;
    … …  
    770774
    771775    if (jQuery("#TB_Image").height() == 0) jQuery("#TB_Image").height(imageHeight); // workaround for "img { height: auto; }" style
    772     var size = tb_getSize(jQuery("#TB_Image"), "margin");
    773     TB_WIDTH = size[0];
    774     TB_HEIGHT = size[1] + tb_getSize(jQuery("#TB_closeWindow"), "margin")[1];
     776    TB_WIDTH = imageWidth + (imgMarginSize[0] - imgSize[0]);
     777    TB_HEIGHT = imageHeight + (winSize[1] - imgSize[1]);
    775778
    776779    if (TB_WIDTH < params['width']*1) {
Note: See TracChangeset for help on using the changeset viewer.