li前的小图标居中对齐 获取滚动条的高度

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Language" content="utf-8" />
<meta name="robots" content="all" />
<meta name="author" content="Tencent-ISRD" />
<meta name="Copyright" content="Tencent" />
<script type="text/javascript" src="jquery-1.8.1.js"></script>
<style type="text/css" media="screen">
ul li{
    list-style-type:none;
    padding-left:15px;
    background: url(file:///C|/Users/huinawang/Desktop/1.png) no-repeat 4px 12px;
    line-height:30px;
    }

</style>
<title>column-rule-style</title>
</head>
<body>

<div class="hideNav-fixed-top">
                <ul>
                    <li><a href="#">很多</a></li>
                    <li><a href="#">很多</a></li>
                    <li><a href="#">很多</a></li>
                    <li><a href="#">很多</a></li>
                    <li><a href="#">很多</a></li>
                </ul>
            </div>
            <div style="height:1000px"></div>

</body>
<script type="text/javascript">
$(document).ready(function(){
    $(window).scroll(function(){
        var scrollTop=$(window).scrollTop();
        console.log(scrollTop);
        if(scrollTop>100){
            $(".hideNav-fixed-top").css("display","block");
            }else{
                $(".hideNav-fixed-top").css("display","none");
                }
        })
    })
</script>
</html>

时间： 2024-10-17 12:04:53

li前的小图标居中对齐 获取滚动条的高度的相关文章

原生JS 和 JQ 获取滚动条的高度，以及距离顶部的高度

JQ:相对比较简便 获取浏览器显示区域(可视区域)的高度 : $(window).height(); 获取浏览器显示区域(可视区域)的宽度 : $(window).width(); 获取页面的文档高度 $(document).height(); 获取页面的文档宽度 : $(document).width(); 浏览器当前窗口文档body的高度: $(document.body).height(); 浏览器当前窗口文档body的宽度: $(document.body).width(); 获取滚动条

CSS控制&quot;标题前增加小图标或编号&quot;

---题目前加图片--- p:before { content:url(xxx/xx.png); }//所有p的最前都有一个图标 p.a:after { content:url(xxx/xx.png); }//而含有类a的p最前和最后都有一个图标 <p>1</p> <p>2</p> <p>3</p> <p>4</p> <p class='a'>5</p> ---题目前加标号--- p:b

js 获取滚动条的高度 以及 设置滚动条的高度

//设置窗口滚动条高度 function setScrollTop(top){ if(!isNaN(top))document.body.scrollTop = top; } //取窗口滚动条高度 function getScrollTop(){ var scrollTop=0; if(document.documentElement&&document.documentElement.scrollTop){ scrollTop=document.documentElement.scrol

获取滚动条可滚动高度

wx.getSystemInfo({ success: (res) => { this.setData({ // clientHeight: res.windowHeight - res.windowWidth / 750 * 96 clientHeight: res.windowHeight }); } }); 原文地址:https://www.cnblogs.com/xiaoxiaoxun/p/12118418.html

小图标和文字的居中对齐-小总结

小图标和文字的居中对齐问题,相信大家在很多时候会遇到.今天楼主从其他大神那边扒了一些方法,现在做个小小的总结. 说明:本次用到的小图标来自阿里巴巴矢量图,大家可以去找一下(地址:http://www.iconfont.cn/plus/collections/detail?cid=3223)我的图标尺寸是20px*20px 第一种办法:vertical-align和line-height结合 特点:这种办法只适用于放置小图标和文字的标签的display属性都是inline的情况. 效果图: 代码如

列表前显示的小图标

列表信息展示有时候会在每行前使用小图标来美化,布局通常也会用到ul li: 1.如果是1张小图标 一般会用background属性来显示图标,background-image:url(); background-repeat: no-repeat; background-position:left center; 另外还可以使用list-style,该属性按顺序有3个值:list-style-type, list-style-position, list-style-image list-sty

佩特来项目经验小集合(1)___js获取前一页面url中传来的值

页面跳转代码: src="AddCLFFour.aspx?ID=<%= Request.QueryString["ID"].ToString() %>"> ,通过" Request.QueryString["ID"].ToString()" 向AddCLFFour传参数ID,在AddCLFFour页面如何获取页面传过来的ID值呢? 下面提供三种方法,简单介绍如何实现js获取前一页面传来的值 1.最简单的方法 

小图标与文本不能对齐的情况

一般直接使用小图标<img/>再加文本,都会出现小图标与文本不能对齐的情况. 如果,小图标和文本在同一div中,解决方法: 1.可以设置小图标vertical-align:middle; 2.设置div样式:background:url() no-repeat left center;(后面两个元素可以根据自己需要调.) 如果小图标和文本在同一A标记中,可以在A标记中加个div,方式同上.

请用fontAwesome代替网页icon小图标

1. 引言 网页小图标到处可见,如果一个网页都是干巴巴的文字和图片,而没有小图标,会显得非常简陋.下面的小图标,你是不是会经常用到? 你可能说——“我们用的都是彩色的,不是黑白的”——别着急,下面会讲到.因为它们也可以变为彩色的. 黑白的也好,彩色的也罢,如果用传统的“css + 图片”的方式来制作这些icon,我估计你至少得雇佣一个专业的设计师吧.一般的程序猿,包括前端程序猿,估计只能去搜索了,不会自己拿ps画.例如,我之前经常去一个叫做“懒人图库”的网站去找资源,现在那个网站还存在. 但是问