繁體中文当前位置: 首页 > 图文教程 > 网页制作 > CSS样式表 > DIV滚动条随机位置的设置技巧
- CSS样式表
- css分页样式代码
- 用css filter做鼠标滑过图片效果
- 有关于IE8 Beta 1两个提醒
- css Hspace 和vspace的图片控制实例
- firefox background-image垂直平铺问题的解决方法
- 发一个css比较清爽的写法
- htm页面中<a name>加name和id的冲突附解决方法
- javascript 获取特定的 CSS属性值
- CSS教程之CSS的应用
- html页面head区域的编码书写规范
- html滚动条样式
- 不用图片作背景CSS做的小灯笼效果_练习用
- 网页绿色系配色应用实例图文
- 网页中英文混排行高不等问题的解决方法
- CSS Hack 汇总速查手册浏览器兼容必会
- css文本框与按钮美化效果代码
- 网页设计中的 serif 和 sans-serif字体应用
- 采用XHTML和CSS设计可重用可换肤的WEB站点的方法
- CSS 浏览器的等宽空格问题解决
- 欲练CSS ，必先解决IE的一些细节分析
CSS样式表 中的 DIV滚动条随机位置的设置技巧
出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-09-28 浏览: 156 ::
收藏到网摘: n/a
刚才一个朋友告诉我他的blog友情链接太多了，所以把所有链接放到一个DIV中，加了个滚动条，可是他又不想每次别人来看，看到的都是前面几个链接，于是问我有没有什么办法，想了一个，呵呵，正好有个办法
style后面用于限定DIV样式并加滚动条，这个不多说
关键的地方其实很简单，最后两行Javascript就是了，起作用的只有最后一行：
obj.scrollTop=obj.scrollHeight*(Math.random());
obj.scrollTop：滚动条距离顶部的位置
obj.scrollHeight：流动区域的高度
Math.random()：获得一个随机数
很简单，有人可能需要，用就拿去，哈哈
PS：IE6 / IE7 / FF2 测试通过
IE7在本地测试时只是每次打开时滚动条位置才不同，刷新却没有变化，但放到网站上之后就正常了
代码如下：
<div id="cc" style="height:250px;width:200px;overflow-y:scroll;overflow-x:hidden;">
<li>01</li><li>02</li><li>03</li><li>04</li><li>05</li><li>06</li><li>07</li><li>08</li>
<li>09</li><li>10</li><li>11</li><li>12</li><li>13</li><li>14</li><li>15</li><li>16</li>
<li>17</li><li>18</li><li>19</li><li>20</li><li>21</li><li>22</li><li>23</li><li>24</li>
<li>25</li><li>26</li><li>27</li><li>28</li><li>29</li><li>30</li><li>31</li><li>32</li>
<li>33</li><li>34</li><li>35</li><li>36</li><li>37</li><li>38</li><li>39</li><li>40</li>
<li>41</li><li>42</li><li>43</li><li>44</li><li>45</li><li>46</li><li>47</li><li>48</li>
</div>
<script>
var obj = document.getElementById("cc");
obj.scrollTop=obj.scrollHeight*(Math.random());
</script>
<li>01</li><li>02</li><li>03</li><li>04</li><li>05</li><li>06</li><li>07</li><li>08</li>
<li>09</li><li>10</li><li>11</li><li>12</li><li>13</li><li>14</li><li>15</li><li>16</li>
<li>17</li><li>18</li><li>19</li><li>20</li><li>21</li><li>22</li><li>23</li><li>24</li>
<li>25</li><li>26</li><li>27</li><li>28</li><li>29</li><li>30</li><li>31</li><li>32</li>
<li>33</li><li>34</li><li>35</li><li>36</li><li>37</li><li>38</li><li>39</li><li>40</li>
<li>41</li><li>42</li><li>43</li><li>44</li><li>45</li><li>46</li><li>47</li><li>48</li>
</div>
<script>
var obj = document.getElementById("cc");
obj.scrollTop=obj.scrollHeight*(Math.random());
</script>
评论 (0) All
