<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
<meta charset="utf-8" />
    <script src="jquery-3.3.1.js"></script>
    <style>
        div{
            background-image:url(1.jpg);
            width:800px;
            height:800px;
            border:1px solid red;
            /*此时显示的图片为平铺*/

background-repeat:no-repeat;

/*显示图片某部分*/
            background-position:-275px -30px;

background-position:-275px -30px;
        }
    </style>
</head>
<body>
    <div>

    </div>
</body>
</html>

jquery 显示图片的更多相关文章

  1. [转]jquery 鼠标放在图片上显示图片的放大镜效果jqzoom_ev-2.3

    本文转自:http://blog.csdn.net/weizengxun/article/details/6768183 鼠标放在图片上显示图片的放大镜效果使用jqzoom实现,本例版本2.3 效果图 ...

  2. jquery表格datagrid单元格显示图片及分页使用

    要想达到自定义显示表格框的目的比如显示图片,超链接,按钮的形式,只需要给列添加formatter属性即可,比如显示图片: columns: [[                             ...

  3. jQuery个性化图片轮播效果

    jQuery个性化图片轮播效果 购物产品展示:图片轮播器<效果如下所示> 思路说明: 每隔一段时间,实现图片的自动切换及选项卡选中效果,鼠标划入图片动画停止,划出或离开动画开始 两个区域: ...

  4. jQuery Lightbox图片放大预览

    简介:jQuery Lightbox图片放大预览代码是一款可以在用户点击页面中的小图片时,将该图片的高清版本以Lightbox的方式放大显示在页面的中间,提高用户的体验度. 效果展示 http://h ...

  5. PgwSlideshow-基于Jquery的图片轮播插件

    0 PgwSlideshow简介 PgwSlideshow是一款基于Jquery的图片轮播插件,基本布局分为上下结构,上方为大图轮播区域,用户可自定义图片轮播切换的间隔时间,也可以通过单击左右方向按键 ...

  6. Image Wall - jQuery & CSS3 图片墙效果

    今天我们要为您展示如何基于 jQuery 和 CSS3 创建一个整洁的图片墙效果.我们的想法是在页面上洒上一些大小不同的缩略图,并在当我们点击图片时候显示丝带,会显示一些描述,再次点击缩略图时,丝带将 ...

  7. jquery实现图片预加载

    使用jquery实现图片预加载提高页面加载速度和用户体,本就为大家详细分析jquery图片预加载的实现原理. 什么时候使用图片预加载? 如果页面使用了很多不是最初加载便可见的图片,有必要进行预加载: ...

  8. 20+功能强大的jQuery/CSS3图片特效插件

    以下是分享的20几个不错的图片特效插件,基于jQuery和CSS3. 1.jQuery图片下滑切换播放效果 这是一款基于jQuery的焦点图插件,这款焦点图的特点是有向下滑动的动画效果,滑到底部时,有 ...

  9. jQuery实现图片轮播

    之前有碰到过jQuery实现列表自动滚动,这次的图片轮播在原理上与之相同,只有一些细微的差别,就是需要在图片的右下角显示当前图片的序号,效果如下: 先看一看html代码,以及对应的css代码: < ...

随机推荐

  1. 【42%】【hdu1166】排兵布阵(树状数组解法&&线段树解法)

    Problem Description C国的死对头A国这段时间正在进行军事演习,所以C国间谍头子Derek和他手下Tidy又开始忙乎了.A国在海岸线沿直线布置了N个工兵营地,Derek和Tidy的任 ...

  2. 【hdu 3032】Nim or not Nim?

    Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) Total Submission(s) ...

  3. amazeui中内置的web组件有哪些且如何用

    amazeui中内置的web组件有哪些且如何用 一.总结 一句话总结: 1.组件还是jquery.js+amazeui.js,和插件一样,准确的说是amazeui.css+jquery.js+amaz ...

  4. 实践-Task

    实践-Task 上篇博文中,我们介绍了Thread和ThreadPool: 多线程异步编程示例和实践-Thread和ThreadPool 本文中我们继续,说一下TPL(Task Parallel Li ...

  5. App各种Icon及Launch image的尺寸和用途

    App各种Icon及Launch image的尺寸和用途 IOS7,8 Asset iPhone 6 Plus (@3x) iPhone 6 and iPhone 5 (@2x) iPhone 4s ...

  6. Fastjson 序列化，反序列化Map对象排序问题（字符串转map，map转字符串）

    背景 记录项目中遇到的 关于fastjson jsonobject转string乱序,string转jsonObject乱序问题的解决方案 fastJson issues 问题来源描述参见: http ...

  7. Android之assets资源目录的各种操作

    第一种方法:       String path = file:///android_asset/文件名; 第二种方法:         InputStream abpath = getClass() ...

  8. TDM-GCC是从mingw-w64项目patch而来，全部使用静态链接，对线程不需要额外的DLL，默认使用SJLJ异常（真是好东西）

    Windows版GCC之TDM-GCC 4.5.2 平时写 C/C++ 小程序的时候,不喜欢开VS,太庞大了,还要建项目.对于小程序,一个可以进行单文件编译的 IDE 是我的首选,我用的是 C-Fre ...

  9. Struts2——（2）配置文件、通配符

    一.Struts配置文件 (1)struts-default.xml(框架自带) 定义了一些框架自带的Result组件,拦截器组件. <package name="struts-def ...

  10. 一些常用的WebServices

    天气预报Web服务,数据来源于中国气象局 Endpoint  Disco  WSDL IP地址来源搜索 WEB 服务(是目前最完整的IP地址数据) Endpoint  Disco  WSDL 随机英文 ...