整合營(yíng)銷服務(wù)商
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
SS 禁止瀏覽器滾動(dòng)條的方法(轉(zhuǎn))
1、完全隱藏 在<boby>里加入scroll="no", 可隱藏滾動(dòng)條；
<boby scroll="no">這個(gè)我用的時(shí)候完全沒(méi)效果, 不知道是什么原因! 不過(guò)好多人說(shuō)這么用可以, 大概是用的位置不一樣吧
2、在不需要時(shí)隱藏 指當(dāng)瀏覽器窗口寬度或高度大于頁(yè)面的寬或高時(shí), 不顯示滾動(dòng)條；反之, 則顯示:
<boby scroll="auto">3、樣式表方法 在<boby>里加入style="overflow-x:hidden", 可隱藏水平滾動(dòng)條；加入style="overflow-y:hidden", 可隱藏垂直滾動(dòng)條。
被包含頁(yè)面里加入 <style> html { overflow-x:hidden; } </style> 有一段解釋是這樣說(shuō)的：body{ overflow-x:hidden; }在標(biāo)準(zhǔn) DTD 下是不可以的
我的問(wèn)題是用這段代碼解決的body{overflow-y:hidden; }
4、另一種方法
<style type="text/css"> html { overflow-x:hidden; overflow-y:hidden; } </style>5、在用ie6瀏覽有框架的xhtml頁(yè)面的時(shí)候, 默認(rèn)會(huì)水平和垂直滾動(dòng)條會(huì)一起出現(xiàn), 這是ie6的一個(gè)bug, 在firefox上是正常的, 出現(xiàn)的原因是其對(duì)XHTML 1.0 transitional doctype的解釋缺陷.
對(duì)于這個(gè)bug一般有3種解決方案，
方法1: 代碼：
html { overflow-y: scroll; }原理：強(qiáng)制顯示ie的垂直滾動(dòng)條，而忽略水平滾動(dòng)條 優(yōu)點(diǎn)：完全解決了這個(gè)問(wèn)題, 允許你保持完整的XHTML doctype.
缺點(diǎn)：即使頁(yè)面不需要垂直滾動(dòng)條的時(shí)候也會(huì)出現(xiàn)垂直滾動(dòng)條。
方法2: 代碼：
html { overflow-x: hidden; overflow-y: auto; }原理：隱藏橫向滾動(dòng)，垂直滾動(dòng)根據(jù)內(nèi)容自適應(yīng)
優(yōu)點(diǎn)：在視覺(jué)上解決了這個(gè)問(wèn)題.在不必要的時(shí)候, 未強(qiáng)制垂直滾動(dòng)條出現(xiàn).
缺點(diǎn)：只是隱藏了水平滾動(dòng)條，如果頁(yè)面真正需要水平滾動(dòng)條的時(shí)候， 屏幕以外的內(nèi)容會(huì)因?yàn)橛脩魺o(wú)法水平滾動(dòng)，而看不到。
方法3: 代碼：
body { margin-right: -15px; margin-bottom: -15px; }原理：這會(huì)在margin的水平和垂直方向上添加一個(gè)負(fù)值, IE添加了該精確數(shù)值后, 便會(huì)去除對(duì)滾動(dòng)條的需求假象.
優(yōu)點(diǎn)：在視覺(jué)上解決了這個(gè)問(wèn)題, 垂直滾動(dòng)根據(jù)內(nèi)容自適應(yīng)
缺點(diǎn)：由于"人為創(chuàng)建"了15px的外邊距(margin), 所以無(wú)法使用該填充過(guò)的屏幕區(qū)域
序：
CSS本身是一個(gè)常用且強(qiáng)大的功能，但是往往很多人在學(xué)習(xí)的時(shí)候會(huì)忽視掉其中一些細(xì)節(jié)的使用，而我們程序員忽視掉一個(gè)細(xì)節(jié)就可能完成不了這道老板出給我們的題目，成為高手的道路也會(huì)離我們?cè)絹?lái)越遠(yuǎn)，這里我在分享一個(gè)我多年來(lái)總結(jié)下來(lái)的一句話-驚喜往往是有準(zhǔn)備的人事先預(yù)謀的，而不是突然產(chǎn)生的，頁(yè)面樣式好不好看取決于我的知識(shí)面有多廣
分享2種方法實(shí)現(xiàn)CSS如何隱藏滾動(dòng)條，同時(shí)仍然可以在任何元素上滾動(dòng)？我們經(jīng)常在前端開(kāi)發(fā)中遇到這種情況，下面一起看看這兩種方法:
、存在問(wèn)題：
【1】線條會(huì)隨著滾動(dòng)條一起滾動(dòng)；
【2】線條SVG存在在多地方引用，存在罩層問(wèn)題，或者遮擋問(wèn)題，設(shè)置z-index無(wú)效
二、解決思路：
1、【1】問(wèn)題解決辦法：
a、可以用transform: scale(0.8) CSS樣式來(lái)縮小畫(huà)布，達(dá)到取消滾動(dòng)條的目的
示例代碼：
transform: scale(0.8);
-moz-transform: scale(0.8); /* Firefox */
-webkit-transform:scale(0.8); /* Safari and Chrome */
-ms-transform:scale(0.8);
b、采用問(wèn)題【2】的辦法，通過(guò)移動(dòng)SVG到里層，自定義發(fā)揮了
c、加入滾動(dòng)條監(jiān)聽(tīng)，并使用自定義position()方法：
leader_line.position()； 備注：leader_line為線條預(yù)設(shè)自定義的變量
2、【2】問(wèn)題問(wèn)題闡述及解決辦法：
闡述：
leader-line，默認(rèn)生成在最外層body下，如果業(yè)務(wù)存在多層，且存在多個(gè)地方引用時(shí)，就無(wú)法用全局樣式z-index來(lái)控制外層顯示，比如彈窗，頁(yè)面線條設(shè)置z-index：1，彈窗部分線條設(shè)置z-index：999，當(dāng)關(guān)閉彈窗時(shí)，z-index就會(huì)變成最高值，如果再打開(kāi)其他彈窗，那么線條會(huì)線上在彈窗之上，無(wú)法再通過(guò)z-index控制；
解決辦法：
可以把外層svg拷貝到需要的DIV里面，并刪除最外層svg；用這種方法能解決很多問(wèn)題。
核心代碼
二、其他知識(shí)點(diǎn)：
1、移除線條：leader_line.remove()
2、顯示線條：leader_line.show()
3、隱藏線條：leader_line.hide()
PS：有其他問(wèn)題也可以留言，說(shuō)不定做項(xiàng)目過(guò)程中也遇到過(guò)
*請(qǐng)認(rèn)真填寫(xiě)需求信息，我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。
