jQuery Screen Resolution Height Adjustment

后端 未结 5 2013
囚心锁ツ
囚心锁ツ 2020-11-30 00:45

In order to better balance out a page I am working on I would like to find a way to increase the top margin of a DIV depending on the screen resolution. What is my best way

相关标签:
5条回答
  • 2020-11-30 01:03

    To get screen resolution in JS use screen object

    screen.height;
    screen.width;
    

    Based on that values you can calculate your margin to whatever suits you.

    0 讨论(0)
  • 2020-11-30 01:08
    var space = $(window).height();
    var diff = space - HEIGHT;
    var margin = (diff > 0) ? (space - HEIGHT)/2 : 0;
    $('#container').css({'margin-top': margin});
    
    0 讨论(0)
  • 2020-11-30 01:14

    Check out the jQuery dimensions plugin

    0 讨论(0)
  • 2020-11-30 01:16

    Here is an example on how to center an object vertically with jQuery:

    var div= $('#div_SomeDivYouWantToAdjust');
    div.css("top", ($(window).height() - div.height())/2  + 'px');
    

    But you could easily change that to whatever your needs are.

    0 讨论(0)
  • 2020-11-30 01:17

    Another example for vertically and horizontally centered div or any object(s):

     var obj = $("#divID");
     var halfsc = $(window).height()/2;
     var halfh = $(obj).height() / 2; 
    
     var halfscrn = screen.width/2;
     var halfobj =$(obj).width() / 2; 
    
     var goRight =  halfscrn - halfobj ;
     var goBottom = halfsc - halfh;
    
     $(obj).css({marginLeft: goRight }).css({marginTop: goBottom });
    
    0 讨论(0)
提交回复
热议问题