網頁設計中上下滾動的滾動欄

1、網頁設計如何設置網頁部分內容不隨著滾動條而移動移動？

div的樣式中使用相當於瀏覽器窗口定位——position:fixed。
一、position:fixed屬性的含義
fixed：生成絕對定位的元素，相對於瀏覽器窗口進行定位。元素的位置通過 "left", "top", "right" 以及 "bottom" 屬性進行規定。
我們平時所說的固定定位指的就是fixed，設置了固定定位的元素不會隨滾動條上下滾動。

二、一般的 position:fixed; 實現方法
#top{position:fixed;bottom:0;right:20px}
實現了id為top的元素固定在瀏覽器的底部和距離右邊20個像素的位置
#top{position:fixed;top:20px;right:20px}
實現了id為top的元素固定在距離瀏覽器的頂部20個像素和距離右邊20個像素的位置

三、IE6下position:fixed; 實現方法
在IE6中是不能直接使用 position:fixed; 。你需要一些 CSS Hack 來解決它
相同的還是讓 <div id="top">...</div> 元素固定在瀏覽器的底部和距離右邊的20個像素，這次的代碼是：#top{
position:fixed;
bottom:0;
right:20px;
_position:absolute;

_top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)));
}
right 跟 left 屬性可以用絕對定位的辦法解決，而 top 跟 bottom 就需要用上面的表達式來實現。其中在_position:absolute; 中的 _ 符號只有 IE6 才能識別，目的是為了區分其他瀏覽器

1、使元素固定在瀏覽器窗口的頂部：
#top{
_position:absolute;
_top:expression(eval(document.documentElement.scrollTop));
}
2、使元素固定距瀏覽器窗口的頂部a像素的位置：
#top{
_position:absolute;
_top:expression(eval(document.documentElement.scrollTop));
_margin-top:a;
}或者
#top{
_position:absolute;
_top:expression(eval(document.documentElement.scrollTop+a));
}
3、使元素固定在瀏覽器窗口的底部：
#top{
_position:absolute;
_top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)));
}
4、使元素固定在距瀏覽器窗口的底部b像素的位置：
#top{
_position:absolute;
_top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)));
_margin-bottom:b;
}或者
#top{
_position:absolute;
_top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||b)-(parseInt(this.currentStyle.marginBottom,10)||b)));
}
四、IE6下的閃動問題
問題還沒有完全解決。在用了上面的辦法後，你會發現：被固定定位的元素在滾動滾動條的時候會閃動。解決閃動問題的辦法是在 CSS 文件中加入：
*html{background-image:url(about:blank);background-attachment:fixed;}
其中 * html選擇器hack是給 IE6 識別的。
到此，IE6 的 position:fixed; 問題已經被解決了

2、網頁設計中怎麼在頁面中設置一個滾動條

css屬性 overflow-y:auto; DIV裡面的內容超過DIV的高度，右邊就會自動出現滾動條

1、用一個div，定製成圖中的寬度和高度
2、然後再把div的樣式設成overflow-y:scroll，當div里的文字超出那個高度的時候，滾動條就出來了。
例如：<div style="width:100px; height:100px; overflow:auto; border:1px solid #000000;"><img src="" style="width:300px; height:300px;"></div>

3、jsp 頁面中怎麼設計上下滾動的頁面

放到個iframe中，例如
<IFRAME name=rightframe src="faq-1.jsp searchLatn=<%=searchLatn%>" frameBorder=0 width=572
scrolling=auto height="570" ></IFRAME>
注意這個scrolling=auto，有這個，那麼葉面內容超過固定表格長度，就內會自動出現容滾動條
，沒超過不出現

4、網頁製作中滾動條的代碼是什麼

下面的都為網頁製作中滾動條的代碼。

overflow: auto;

font-family: Arial,Helvetica,sans-serif;

font-size: 9pt;

line-height: 8px;

color: #000000;

text-decoration: none;

height:250px;

SCROLLBAR-FACE-COLOR:#FFFF00 ;

SCROLLBAR-HIGHLIGHT-COLOR: #87CEFA ;

SCROLLBAR-SHADOW-COLOR: #DEEB9F;

SCROLLBAR-3DLIGHT-COLOR:#00BFFF;

SCROLLBAR-TRACK-COLOR:#BA55D3 ;

SCROLLBAR-ARROW-COLOR: #D3D3D3 ;

SCROLLBAR-DARKSHADOW-COLOR: gold;}

5、關於網頁設計中滾動欄的製作。。

看我這個，簡單的。

說明:1、你放的內容再多表面上會在Dreamweaver中撐破，但是在瀏覽器是正常
2、這個就是marquee的用法，height 、width定義了滾動的范圍，具體的你可以在百度查

<marquee direction=left height=100 scrollamount=1 scrolldelay=2 width=600>
這里放置要滾動的內容，表格、圖片、文字都可以
</marquee>

6、用DW製作網頁，瀏覽時沒有上下滾動條

樓上的說話說一半。。。。新手很多不懂，要說清楚，1樓的說的對，但是還有一個選擇框架，只要在框架內部，按住alt，左點滑鼠就可以選中該框架

7、什麼是網頁設計中的滾動設計？如何進行滾動設計？

曾經的網站設計「禁忌」已經成為最受歡迎的技術之一，下面將討論一些滾動設計的利弊，並分析一些技巧。

滾動設計適合你的產品嗎？

每一種設計技巧和工具，都有喜歡這個概念的人和那些討厭它的人。在大多數情況下，任何一方都不是本質上對錯的；因此，在處理此類項目之前，權衡所有注意事項非常重要。

滾動的優點：

鼓勵互動 – 隨著不斷變化的元素不斷刺激，它可以是一種有趣的講故事方法，鼓勵用戶交互 - 尤其是高雅執行的視差滾動。

更快 – 長滾動比單擊復雜的導航路徑更快，並且不會減慢或限制用戶體驗。如Interaction Design Best Practices中所述，對時間的感知通常比實際時間的流逝更重要。

吸引用戶 – 易用性可促進交互性，增加現場時間。對於無限滾動網站尤其如此，您可以在其中幫助用戶發現他們可能甚至沒有想到的相關內容。

響應式設計 – 頁面設計在具有不同屏幕大小和功能的設備之間可能會變得復雜，但滾動有助於簡化差異。

手勢控制 – 滾動似乎與觸摸有著有機的聯系，因為向下輕掃比在屏幕上不同區域重復點擊要自然得多。用戶（尤其是移動設備）通常接受這一方式來顯示信息。

令人愉快的設計 – 不需要多次單擊即可獲得更快的交互，從而獲得更類似於應用或游戲的用戶體驗。

滾動的缺點

固執用戶 –一些用戶總是毫無理由地去抵制改變。盡管如此，該技術現在非常普遍（特別是在移動體驗期間），可以說大多數用戶都習慣了這種技術。

SEO缺點 - 只有一個頁面可能對網站的SEO產生負面影響。

迷失方向 - 滾動和內容之間的斷開可能會使用戶感到困惑或脫節。

導航困難 – "返回"頁面上的先前內容可能會很尷尬。為了對付這種情況，您可以創建一個持久的頂部導航，其中每個部分都錨定到頁面。

網站速度 – 視頻或圖像圖庫等大量內容可能會降低網站速度，尤其是視差滾動網站，它們依賴於 Javascript 和 jQuery

沒有頁腳 – 使用無限滾動網站，我們建議使用簡約的"粘性"頁腳，這樣您就不會犧牲可導航性。否則，用戶可能會因為頁面底部缺少進一步的導航而感到困惑。

撇開優點和缺點不談，某些類型的網站更適合長滾動設計。更長的滾動網站更適合……

...包含很大一部分移動流量（大多數用戶）

...包括頻繁更新或新內容（如博客）

...有很多信息以單一的方式呈現，以便理解（如信息圖）

...不包含富媒體，因為這可能導致負載時間的消耗

滾動最佳實踐

長滾動、視差效應和類似機制在設計領域中仍然比較新（約4年歷史），但仍從試錯經驗中可以獲取一些基本的最佳實踐。

從 2015 和 2016 的 Web 設計趨勢總結，以下是成功實現長滾動的一些日常技巧。

不用擔心短滾動和長滾動交替使用。 讓內容決定滾動長度，而不是反過來。 使用短滾動主頁和長滾動著陸頁（如產品，旅遊等）非常好（並且非常受歡迎）。

考慮粘性導航，以便用戶始終可以快速"返回"或從滾動中的元素跳轉到另一個元素。

將滾動與設計元素或工具結合，以便每個用戶都能快速了解網站的工作方式。箭頭、動畫按鈕或類似的用戶界面工具是幫助用戶確定下一步操作的有趣且簡單的方法。有些網站甚至包含一個小按鈕，其中包含"滾動更多"或"開始"等說明，來提高頁面的導航性。

明確區分滾動點擊和其他CTA元素，以便網站獲得所需的交互。

做一些研究，看看用戶如何與滾動交互。例如，在 Google 分析中，可以打開"網頁分析"選項卡，查看屏幕下方（第二屏及之後）用戶的點擊數。然後，你可以根據需要調整設計。

不要過分。長滾動並不意味著 500 頁的連續內容 - 長滾動也可以很簡單。講述你的故事，然後適可而止，不要喋喋不休 。

專注於用戶目標，並接受即使是無限滾動網站也不是真正無窮無盡的。 創建長滾動網站時，要了解用戶仍需要方向感（當前位置）和導航（其他可能的路徑）。

包括有助於在滾動中定位用戶的視覺提示，例如左下方用於「七種類型的摩托車騎手」站點的頭盔圖標。

滾動可能是一把雙刃劍，所以堅持使用它的建議用法，以避免它弊大於利。

平時用墨刀設計原型時候，可以直接拖動，增加頁面長度，進行滾動設計。

8、網頁設計中像這樣的滾動窗口，代碼是什麼，求大神解決！！！

這是一段js寫的，不過裡面的文字圖片是代碼控制後台添加的，我這里有可以聯系我

9、再網頁設計中如何做滾動的公告欄？

<marquee behavior="scroll" onmouseover=this.stop() onmouseout=this.start() width=220 height=120 direction="up">這里是公告內容</marquee>
高度和寬度可以自己調

10、在網站設計中：文字垂直向上滾動怎麼弄，求代碼、CSS，求詳解???

這段代碼你看下是不是你要的效果。如果不是可以繼續追問
<div style="width:200px; height:300px">
<marquee direction="up" truespeed="truespeed" height="300px" behavior="scroll">
<p></p>
<p></p>
<p></p></marquee></div>