需要做几件事:

第一:样式表定义

    .red
{
border: 2px solid #ffffff;
}

第二:定义抖动函数

       function shake(ele, cls, times) {
var i = 0, t = false, o = ele.attr("class") + " ", c = "", times = times || 2;
if (t) return;
t = setInterval(function () {
i++;
c = i % 2 ? o + cls : o;
ele.attr("class", c);
if (i == 2 * times&&false) {
clearInterval(t);
ele.removeClass(cls);
}
}, 200);
};

第三:定义抖动部件

 <span id="msg">
@if (ViewBag.msgCount > 0)
{
<img id="msg_img" src="@Url.Content("~/Content/warning.png")" width="12" alt="loading" />
<span style="color:Red;">@ViewBag.msgCount</span>
}
</span>

第四:调用

   $(document).ready(function () {
shake($("#msg"), "red", 1);
});

第五:收工

jquery 实现图片跳动。提示作用的更多相关文章

  1. 一款基于jQuery的图片场景标注提示弹窗特效

    今天给大家分享一款基于jQuery的图片场景标注提示弹窗特效,这款实例适合在图片上标注某个物件,单击弹出详情说明,兼容360.FireFox.Chrome.Safari.Opera.傲游.搜狗.世界之 ...

  2. Javascript和jQuery WordPress 图片轮播插件, 内容滚动插件,前后切换幻灯片形式显示

    用于在有限的网页空间内展示一组产品图片或者照片,同时还有非常吸引人的动画效果.本文向大家推荐12款实用的 jQuery 图片轮播效果插件,帮助你在你的项目中加入一些效果精美的图片轮播效果,希望这些插件 ...

  3. 18款 非常实用 jquery幻灯片图片切换

    1.jquery图片滚动仿QQ商城带左右按钮控制焦点图片切换滚动 jquery图片特效制作仿腾讯QQ商城首页banner焦点图片轮播切换效果,带索引按钮控制和左右按钮控制图片切换. 查看演示>& ...

  4. 鼠标划过图片title 提示实现

    鼠标划过图片title 提示实现 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "h ...

  5. Jquery qTip2实现多种提示效果,支持ajax,以及多种样式

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. jQuery简单纯文字提示条

    如何制作jQuery简单纯文字提示条,先介绍提示条(tooltip)的意思是用户鼠标悬停经过事件发生提示title.它们已经呈现在大多数浏览器中,当你可以提供一个链接或图片的title属性,就是用户将 ...

  7. Jquery实现图片瀑布流思路-简单版

    目录 Jquery实现图片瀑布流思路-简单版 1.预备 2.开始 1.声明 2.主体 3.窗体大小改变事件 Jquery实现图片瀑布流思路-简单版 注意:本篇文章基于知道每张图片的实际尺寸的情况下 特 ...

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

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

  9. jQuery Lightbox图片放大预览

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

随机推荐

  1. New full duplex HTTP tunnel implementation (client and server)

    https://issues.jboss.org/browse/NETTY-246?page=com.atlassian.jirafisheyeplugin:fisheye-issuepanel —— ...

  2. Android实例-手机震动(XE8+小米2)

    相关资料:http://blog.csdn.net/laorenshen/article/details/41148843 结果: 1.打开Vibrate权限为True. 2.规律震动我没感觉出来,有 ...

  3. 条件编译#ifdef的妙用详解_透彻

    这几个宏是为了进行条件编译.一般情况下,源程序中所有的行都参加编译.但是有时希望对其中一部分内容只在满足一定条件才进行编译,也就是对一部 分内容指定编译的条件,这就是“条件编译”.有时,希望当满足某条 ...

  4. TypeScript学习笔记(二):基本数据类型及数据转换

    数据类型 我们来看看TypeScript中的基本数据类型都有哪些. boolean 布尔值,支持true和false. var isDone: boolean = false; 默认为undefine ...

  5. "file:///" file 协议

    [问题] 在WLW中拖入本地图片文件,然后调试过程中,选中对应图片,看到获得的对应的html源码中,图片地址是这样的: href="file:///C:/Users/CLi/AppData/ ...

  6. IT职场生存法则

    转!!!!!!!!!!!!! 摘要我在IT职场打滚超过15年了,从小小的程序员做到常务副总.相对于其它行业,IT职场应该算比较光明的了,但也陷阱重重,本文说说我的亲身体会,希望大家能在IT职场上战无不 ...

  7. Codeforces Round #331 (Div. 2) D. Wilbur and Trees 记忆化搜索

    D. Wilbur and Trees Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://codeforces.com/contest/596/p ...

  8. ListView删除选中的多项目

    //ListView删除选中的多项目function DeleteMultSelItems(ListView:TListView):Boolean;var  I: Integer;begin  Res ...

  9. 通过ulimit改善linux系统性能(摘自IBM)

    本文介绍了 ulimit 内键指令的主要功能以及用于改善系统性能的 ulimit 用法.通过这篇文章,读者不仅能够了解 ulimit 所起的作用.而且能够学会怎样更好地通过 ulimit 限制资源的使 ...

  10. nginx配置图片服务器

    这几天研究了一下nginx配置图片服务器的相关内容,个人的一些收获与大家分享一下: Nginx是目前非常流行的web服务器,它起源于俄罗斯.它具有处理速度快,并发量大,占用资源极低等优点,尤其对于静态 ...