iframe 上下滾動(dòng)條如何默認(rèn)在下方實(shí)現(xiàn)原理
更新時(shí)間:2012年12月10日 09:24:20 作者:
iframe 上下滾動(dòng)條如何默認(rèn)在下方,做的是聊天工具,數(shù)據(jù)多了,每次刷新出現(xiàn)的上下滾動(dòng)默認(rèn)在上方,還需下拉到下面才能看到聊天記錄,本文將介紹,如和實(shí)現(xiàn)在下方
問題:iframe 上下滾動(dòng)條如何默認(rèn)在下方,做的是聊天工具,數(shù)據(jù)多了,每次刷新出現(xiàn)的上下滾動(dòng)默認(rèn)在上方,還需下拉到下面才能看到聊天記錄,有辦法讓它出現(xiàn)在下方嗎?
答案:直接在iframe里寫window.scrollTo(0,9999999)或者設(shè)置div等容器的scrollTop
document.getElementById(“x”).scrollTop = document.getElementById(“x”).scrollHeight
window.scrollTo(0,9999999)
這個(gè)是解決了在下方,但是有新信息后,滾動(dòng)條不會(huì)自動(dòng)到下方,我是希望像qq聊天窗口一樣,有新內(nèi)容了,自動(dòng)到最下方,應(yīng)該如何來解決呢?
那就應(yīng)該判斷當(dāng)前生成的內(nèi)容是什么位置,即它的top或者margin-top是多少,再設(shè)置滾動(dòng)條的高度,這個(gè)就可以了,每次生成就調(diào)用一下滾動(dòng)條的高度變化,每次得到的新數(shù)據(jù)后,再調(diào)用 window.scrollTo(0,9999999)這個(gè)方法,就可以解決這個(gè)問題了!
答案:直接在iframe里寫window.scrollTo(0,9999999)或者設(shè)置div等容器的scrollTop
復(fù)制代碼 代碼如下:
document.getElementById(“x”).scrollTop = document.getElementById(“x”).scrollHeight
window.scrollTo(0,9999999)
這個(gè)是解決了在下方,但是有新信息后,滾動(dòng)條不會(huì)自動(dòng)到下方,我是希望像qq聊天窗口一樣,有新內(nèi)容了,自動(dòng)到最下方,應(yīng)該如何來解決呢?
那就應(yīng)該判斷當(dāng)前生成的內(nèi)容是什么位置,即它的top或者margin-top是多少,再設(shè)置滾動(dòng)條的高度,這個(gè)就可以了,每次生成就調(diào)用一下滾動(dòng)條的高度變化,每次得到的新數(shù)據(jù)后,再調(diào)用 window.scrollTo(0,9999999)這個(gè)方法,就可以解決這個(gè)問題了!
相關(guān)文章
Javascript之BOM(window對(duì)象)詳解
下面小編就為大家?guī)硪黄狫avascript之BOM(window對(duì)象)詳解。小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-05-05
深入解析JavaScript編程中的this關(guān)鍵字使用
這篇文章主要介紹了深入解析JavaScript編程中的this關(guān)鍵字使用,是JS入門學(xué)習(xí)中的基礎(chǔ)知識(shí),需要的朋友可以參考下2015-11-11
JavaScript中的運(yùn)算符種類及其規(guī)則介紹
JavaScript中的運(yùn)算符有很多,主要分為算術(shù)運(yùn)算符,等同全同運(yùn)算符,比較運(yùn)算符,字符串運(yùn)算符,邏輯運(yùn)算符,賦值運(yùn)算符等,它們都有一個(gè)自己的運(yùn)算規(guī)則,在本文為大家介紹下2013-09-09
21個(gè)JavaScript事件(Events)屬性匯總
本文介紹了學(xué)習(xí)JavaScript事件的21個(gè)屬性,算是對(duì)自己近期學(xué)習(xí)javascript的一個(gè)小小的總結(jié),這里推薦給大家。2014-12-12
關(guān)于session和cookie的簡(jiǎn)單理解
下面小編就為大家?guī)硪黄P(guān)于session和cookie的簡(jiǎn)單理解。小編覺得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-06-06
Ajax responseText解析json數(shù)據(jù)案例詳解
這篇文章主要介紹了Ajax responseText解析json數(shù)據(jù)案例詳解,本篇文章通過簡(jiǎn)要的案例,講解了該項(xiàng)技術(shù)的了解與使用,以下就是詳細(xì)內(nèi)容,需要的朋友可以參考下2021-08-08
JavaScript基礎(chǔ)心法 數(shù)據(jù)類型
一個(gè)很基礎(chǔ)的知識(shí)點(diǎn),這篇主要是介紹JavaScript中基本數(shù)據(jù)類型和引用數(shù)據(jù)類型是如何存儲(chǔ)的,需要的朋友可以參考下2018-03-03
Javascript 按位與運(yùn)算符 (&)使用介紹
Javascript 按位與運(yùn)算符 (&),用于對(duì)兩個(gè) 32 位表達(dá)式執(zhí)行按位“與”運(yùn)算,而一般表達(dá)式里面都是十進(jìn)制整數(shù),此時(shí)需要先轉(zhuǎn)換成對(duì)應(yīng)的二進(jìn)制,然后向前加0,補(bǔ)足32位2014-02-02

