jquery計算出left和top,讓一個div水平垂直居中的簡單實例
更新時間:2016年07月13日 11:12:51 投稿:jingxian
下面小編就為大家?guī)硪黄猨query計算出left和top,讓一個div水平垂直居中的簡單實例。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
實例如下:
if($("#cont1").css("position")!="fixed"){ $("#cont1").css("position","absolute"); var dw = $(window).width(); var ow = $("#cont1").outerWidth(); var dh = $(window).height(); var oh = $("#cont1").outerHeight(); var l = (dw - ow) / 2; var t = (dh - oh) / 2 > 0 ? (dh - oh) / 2 : 10; var lDiff = $("#cont1").offset().left - $("#cont1").position().left; var tDiff = $("#cont1").offset().top - $("#cont1").position().top; l = l + $(window).scrollLeft() - lDiff; t = t + $(window).scrollTop() - tDiff; $("#cont1").css("left",l + "px"); $("#cont1").css("top",t + "px"); }
以上這篇jquery計算出left和top,讓一個div水平垂直居中的簡單實例就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考,也希望大家多多支持腳本之家。
您可能感興趣的文章:
- 淺談jQuery頁面的滾動位置scrollTop、scrollLeft
- jQuery中scrollLeft()方法用法實例
- jQuery 位置函數(shù)offset,innerWidth,innerHeight,outerWidth,outerHeight,scrollTop,scrollLeft
- jquery計算鼠標和指定元素之間距離的方法
- 用Jquery選擇器計算table中的某一列某一行的合計
- 一個簡單的jQuery計算器實現(xiàn)了連續(xù)計算功能
- jQuery實現(xiàn)購物車多物品數(shù)量的加減+總價計算
- jQuery 計算iframe 窗口大小的方法
- jQuery計算textarea中文字數(shù)(剩余個數(shù))的小程序
- 基于jQuery的計算文本框字數(shù)的代碼
- jQuery居中元素scrollleft計算方法示例
相關(guān)文章
jQuery plugin animsition使用小結(jié)
本文通過實例代碼給大家分享了jQuery plugin animsition用法,非常不錯,具有參考借鑒價值,需要的朋友參考下吧2017-09-09jQuery 獲取、設(shè)置HTML或TEXT內(nèi)容的兩種方法
這篇文章主要介紹了jQuery 獲取、設(shè)置HTML或TEXT內(nèi)容的兩種方法,需要的朋友可以參考下2014-05-05詳解JavaScript中jQuery和Ajax以及JSONP的聯(lián)合使用
這篇文章主要介紹了詳解JavaScript中jQuery和Ajax以及JSONP的聯(lián)合使用,jQuery庫和Ajax異步結(jié)構(gòu)以及JSON數(shù)據(jù)傳輸也是JS日常編程中最常用到的東西,需要的朋友可以參考下2015-08-08