<!DOCTYPE html>

<html>

<head lang="en">

    <meta charset="UTF-8">

    <title>为图片添加边框</title>

    <script type="text/javascript" src="./js/jquery-1.8.3.min.js"></script>

    <script type="text/javascript">

        //方法1 使用css()方法

//        $(function(){

//            $("img").eq(0).click(function(){

//                $(this).css("border","1px solid red");

//            })

//        })

        //方法2 使用addClass（）方法

        $(function(){

            $("img").click(function(){

                $(this).addClass('border');

            })

        })

    </script>

    <style type="text/css">

        .border{border:1px solid #ccc;}

    </style>

</head>

<body>

<img src="./images/pic.gif" />

</body>

</html>

点击图片加边框.html

jQuery - 点击图片加边框的更多相关文章

  1. CSS鼠标悬停图片加边框效果,不位移的方法

    <!DOCTYPE HTML> <html lang="en-US"> <head> <title>css实现鼠标悬停时图片加边框效 ...

  2. jquery点击图片选中特效

    jquery点击图片选中特效 点击在线预览效果

  3. jQuery点击图片放大拖动查看效果

    效果如图: 放大前: 放大后(可拖动图片浏览): 源码如下: <html xmlns="http://www.w3.org/1999/xhtml"> <head& ...

  4. C#实现给图片加边框的方法

    Bitmap bit= new Bitmap(@"" + Path);//给图片加边框 //Bitmap bit = new Bitmap(Screen.AllScreens[0] ...

  5. PHP 给图片加边框

    /** * 给图片加边框 by liangjian 2014-06-19 * @param $ImgUrl 图片地址 * @param $SavePath 新图片保存路径 * @param $px 边 ...

  6. CSS鼠标悬停图片加边框效果，页面布局发生错位的解决办法

    CSS鼠标悬停图片加边框效果,页面布局发生错位的解决办法 .recomend-list{ width:1200px; a{ @extend %fl; margin-right: 30px; width ...

  7. jQuery点击图片弹出放大可拖动图片查看

    CSS代码: .popup-bigic { position: absolute; ; ; background: #eee; overflow: hidden; ; } .popup-bigic . ...

  8. Jquery 点击图片在弹出层显示大图

    http://blog.csdn.net/wongwaidah/article/details/28432427(案例链接出处,本人只是转载收藏) <html> <head> ...

  9. Android 给图片 加边框

    图片处理时,有时需要为图片加一些边框,下面介绍一种为图片添加简单边框的方法. 基本思路是:将边框图片裁剪成八张小图片(图片大小最好一致,不然后面处理会很麻烦),分别对应左上角,左边,左下角,下边,右下 ...

随机推荐

  1. HTML中的行级标签和块级标签 《转换》

    1.html中的块级标签 显示为“块”状,浏览器会在其前后显示折行.常用的块级元素包括: <p>, <ul>,<table>,<h1~h6>等. 2.h ...

  2. CSS知识点整理(2):框模型，定位

    1. 框模型:Box Model 规定了元素处理元素框处理元素内容.外边距.边框.内边距的方式. 2. 当边距给定的值 可以小于4个.CSS定义了一些规则.处理这中情况: 如果缺少左外边距的值,则使用 ...

  3. 笔记《精通css》第5章 链接应用样式

    第5章    链接应用样式 1.链接伪类选择器 a : link{    }   (寻找没有被访问过的链接) a : visied{    }(寻找被访问过的链接) 动态伪类选择器 a : hover ...

  4. 简单TCP代码

    服务器: SOCKET s; s = ::socket(AF_INET,SOCK_STREAM,); sockaddr_in addr; addr.sin_family = AF_INET; addr ...

  5. 利用js写全选操作

    <script type="text/javascript"> function checkall(qx) { var ck=document.getElementsB ...

  6. 批量注释LOG

    sed -i "s/LOG/\/\/ LOG/g" `grep LOG\(TRACE\) -rl .`

  7. 从ABC到流利口语-unit01

    Unit 1 Introduction1 Good evening,everyone.It's a pleasure to you all. My name is Wang Dong.I'M from ...

  8. TCP报文到达确认（ACK）机制

    TCP数据包中的序列号(Sequence Number)不是以报文段来进行编号的,而是将连接生存周期内传输的所有数据当作一个字节流,序列号就是整个字节流中每个字节的编号.一个TCP数据包中包含多个字节 ...

  9. ARX中类型强制转换

    比如 克隆 clone, 获得的是一个acrxobject, acrxobject *pobj=pployline->clone(); acdbpolyline *ppoly=acdbpolyl ...

  10. P1002 过河卒 【递推、简单动规】

    题目描述 棋盘上AA点有一个过河卒,需要走到目标BB点.卒行走的规则:可以向下.或者向右.同时在棋盘上CC点有一个对方的马,该马所在的点和所有跳跃一步可达的点称为对方马的控制点.因此称之为“马拦过河卒 ...