jquery实现div阴影效果示例代码
<html>
<head>
<style>
.mydiv1 {height:250px;width:250px;border:#909090 1px solid;}
.mydiv2 {
width:250px;height:250;border:#909090 1px solid;background:#fff;color:#333;
filter:progid:DXImageTransform.Microsoft.Shadow(color=#909090,direction=120,strength=4);/*ie*/
-moz-box-shadow: 2px 2px 10px #909090;/*firefox*/
-webkit-box-shadow: 2px 2px 10px #909090;/*safari或chrome*/
box-shadow:2px 2px 0px #909090;/*opera或ie9*/
}
</style>
<script>
function changediv(v){
var d = document.getElementById("mydiv");
if(v == "t") d.className="mydiv2";
else d.className="mydiv1";
}
</script>
</head>
<body>
<div id="mydiv" class="mydiv1" onmouseover="changediv('t');" onmouseout="changediv('f');">
contents
</div>
</body>
</html>
相关推荐
-
jquery实现div阴影效果示例代码
复制代码 代码如下: <html> <head> <style> .mydiv1 {height:250px;width:250px;border:#909090 1px solid;} .mydiv2 { width:250px;height:250;border:#909090 1px solid;background:#fff;color:#333; filter:progid:DXImageTransform.Microsoft.Shadow(color=#90
-
jQuery 动态粒子效果示例代码
1.js部分 var RENDERER = { PARTICLE_COUNT : 1000, PARTICLE_RADIUS : 1, MAX_ROTATION_ANGLE : Math.PI / 60, TRANSLATION_COUNT : 500, init : function(strategy){ this.setParameters(strategy); this.createParticles(); this.setupFigure(); this.reconstructMetho
-
jQuery调用RESTful WCF示例代码(GET方法/POST方法)
不废话了,直奔主题吧 wcf端: 近几年比较流行restful,为了能让ajax调用,同时也为了支持restful风格的uri,在创建一个Ajax-enabled Wcf Service后,必须手动修改svc文件,指定Factory,即: <%@ ServiceHost Language="C#" Debug="true" Service="ajaxSample.HelloWorld" CodeBehind="HelloWorld
-
Jquery实现自定义tooltip示例代码
Jquery实现自定义tooltip,具体代码如下 复制代码 代码如下: <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication247.Default" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tran
-
iOS如何为圆角添加阴影效果示例代码
前言 大家都知道在iOS中为UIView添加阴影还是比较简单的,只需要设置layer的shadow属性就可以了,但是问题在于设置阴影之后,必须设置masksToBounds为NO,而圆角图片则要求masksToBounds必须为YES,两者相互冲突,会导致无法正确的添加阴影.下面就来给大家介绍正确为圆角添加阴影的效果,话不多说了,来一起看看详细的介绍吧. 先来看看效果图: 正确的做法: 先创建一个透明的UIView,并添加阴影,设置masksToBounds为NO: 然后在透明的UIView上添
-
jquery 循环显示div的示例代码
直接看例子 复制代码 代码如下: for(var p=1; p<=5; p++){ $("#properties"+p).show(); //下面有五个id为properties1 .properties2 .properties3 .properties4.properties5的div //我们用一个语句就让下面五个div显示成功了. } } <div class="banner" id="properties1"> <
-
jquery特效 幻灯片效果示例代码
jquery特效 幻灯片效果,效果图如下: 复制代码 代码如下: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf8" /> <title>jquery特效</title> <style> /* CSS Document */ body,h1,
-
jquery实现metro效果示例代码
1.<head>标签需要依此引用metrojs.css.jquery.js.metro.js,代码demo如下 复制代码 代码如下: <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <link href="http://www.drewgreenwell.
-
jquery 获取标签名(tagName)示例代码
如果是为了取到tagName后再进行判断,那直接用下面的代码会更方便: $(element).is('input') 如果是要取到标签用作到别的地方,可以使用一下代码: $(element)[0].tagName 或: $(element).get(0).tagName 下面是补充: jQuery 的 get(index) 方法允许选择一个实际的 DOM 元素并且对其直接操作,而不是通过 jQuery 函数,尔后可以直接访问 DOM 元素的 tagName 属性.$(this).get(0) 与
-
封装的jquery翻页滚动(示例代码)
HTML结构: 复制代码 代码如下: ul._rollSe{width:100px;height:300px;over-flow:hidden} ul._rollSe li._rollPar{height:100px;border:1px solid #369} 复制代码 代码如下: <div class="_rollParent"> <ul class="_rollPageSe"> <li class="_rollpa
随机推荐
- Python中shutil模块的常用文件操作函数用法示例
- ASP.NET MVC 从IHttp到页面输出的实例代码
- jsp中自定义Taglib详解
- ListView实现顶部和底部内容指示器的方法
- Mysql中返回一个数据库的所有表名,列名数据类型备注
- Node.js 回调函数实例详解
- Python-基础-入门 简介
- js时间控件只显示年月
- linux shell查看当前外网IP
- C++ 简单实现MFC ListControl 点击列头排序
- 关于JavaScript作用域你想知道的一切
- javascript之解决IE下不渲染的bug
- 基于dropdown.js实现的两款美观大气的二级导航菜单
- 通过IP安全策略 WIN2003禁止PING
- android接收到蓝牙配对请求时如何点亮屏幕具体实现
- 详解C++中基类与派生类的转换以及虚基类
- C语言基础 原码、反码、补码和移码详解
- 怎样在PHP中通过ADO调用Asscess数据库和COM程序
- Android实现支持进度条显示的短信备份工具类
- Linux入侵常用命令之防黑客示例代码