js控制元素顯示在屏幕固定位置及監(jiān)聽屏幕高度變化的方法

更新時(shí)間：2015年08月11日 12:10:23 作者：dannywj1371

這篇文章主要介紹了js控制元素顯示在屏幕固定位置及監(jiān)聽屏幕高度變化的方法,涉及javascript針對(duì)頁(yè)面元素及樣式屬性的相關(guān)操作技巧,需要的朋友可以參考下

本文實(shí)例講述了js控制元素顯示在屏幕固定位置及監(jiān)聽屏幕高度變化的方法。分享給大家供大家參考。具體如下：

//控制logo的顯示位置 Begin
window.addEventListener("resize", function () {
  // 得到屏幕尺寸 (內(nèi)部/外部寬度，內(nèi)部/外部高度)
  changeLogoPosition();
}, false);
changeLogoPosition();
function changeLogoPosition() {
  var contentHeight = $("#main_content_div").css("height");
  var logoHeight = $("#third_party_logo").css("height");
  contentHeight = parseInt(contentHeight.replace('px', ''));
  logoHeight = parseInt(logoHeight.replace('px', ''));
  //alert('屏幕高度：'+document.body.scrollHeight+' 內(nèi)容高度：'+contentHeight+' logo高度：'+logoHeight);
  if (document.body.scrollHeight - contentHeight > logoHeight) {
    document.getElementById('third_party_logo').style.position = 'absolute';
  } else {
    document.getElementById('third_party_logo').style.position = '';
  }
}
//控制logo的顯示位置 End

希望本文所述對(duì)大家的javascript程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

提高 DHTML 頁(yè)面性能
提高 DHTML 頁(yè)面性能...
2006-12-12
js獲取checkbox復(fù)選框選中的選項(xiàng)實(shí)例
這篇文章主要介紹了js如何獲取checkbox復(fù)選框選中的選項(xiàng),比較適合新手，需要的朋友可以參考下
2014-08-08
JS處理一些簡(jiǎn)單計(jì)算題
本篇文章通過JS來(lái)實(shí)現(xiàn)以下日常用經(jīng)常用到的計(jì)算以及換算等小工具，有興趣的朋友可以學(xué)習(xí)下。
2018-02-02
js（jquery）實(shí)現(xiàn)無(wú)刷新跳轉(zhuǎn)404頁(yè)面不存在效果
有時(shí)候我們希望臨時(shí)讓某個(gè)分類或者多個(gè)文章不能正常訪問，手動(dòng)給html文件改名？或者改后臺(tái)改程序？太麻煩了。用本文的js代碼很容易實(shí)現(xiàn)，而且使用得當(dāng)很隱蔽。這篇文章主要介紹了js（jquery）實(shí)現(xiàn)無(wú)刷新跳轉(zhuǎn)404頁(yè)面不存在效果,需要的朋友可以參考下
2023-04-04
如何使用JavaScript實(shí)現(xiàn)無(wú)縫滾動(dòng)自動(dòng)播放輪播圖效果
這篇文章主要介紹了如何使用JavaScript實(shí)現(xiàn)“無(wú)縫滾動(dòng) 自動(dòng)播放”輪播圖效果,本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下
2020-08-08
Bootstrap表格制作代碼
這篇文章主要為大家詳細(xì)介紹了Bootstrap表格的制作代碼，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2017-03-03
js流動(dòng)式效果顯示當(dāng)前系統(tǒng)時(shí)間
這篇文章主要為大家詳細(xì)介紹了js實(shí)現(xiàn)流動(dòng)式時(shí)間效果的相關(guān)資料，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2016-05-05
利用Node.js創(chuàng)建一個(gè)密碼生成器的全步驟
這篇文章主要給大家介紹了關(guān)于如何利用Node.js創(chuàng)建一個(gè)密碼生成器的相關(guān)資料,文章將實(shí)現(xiàn)的步驟一步步介紹的非常詳細(xì),對(duì)大家具有也一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下
2021-07-07
TypeScript魔法堂之枚舉的超實(shí)用手冊(cè)
這篇文章主要介紹了TypeScript魔法堂之枚舉的超實(shí)用手冊(cè)，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧
2020-10-10
JS實(shí)現(xiàn)兼容各種瀏覽器的高級(jí)拖動(dòng)方法完整實(shí)例【測(cè)試可用】
這篇文章主要介紹了JS實(shí)現(xiàn)兼容各種瀏覽器的高級(jí)拖動(dòng)方法,以完整實(shí)例形式分析了JS實(shí)現(xiàn)響應(yīng)鼠標(biāo)事件動(dòng)態(tài)修改頁(yè)面元素的相關(guān)技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2016-06-06