先来拜见使用方式。
演示地址
HTML文件中如此写:

测量试验的时候,注意当前目录中,有代码中的html文件。

中央代码:

复制代码 代码如下:

复制代码 代码如下:

复制代码 代码如下:

<div class=”jcutter”>
<img src=”1.jpg” alt=””>
<div class=”jcutter-content”>
那是点开后的页面包车型地铁从头到尾的经过
</div>
     </div>

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN”
“;
<html xmlns=”;
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=gb2312″
/>
<title>Windows窗口展开</title>
<script language=”javascript”>
var winID = null;
//展开窗口
function openWindow()
{
winID = window.open(“windowTime.html”,”JavaScript”);
}
//关闭窗口
function closeWindow()
{
if(winID && winID.open && !winID.closed)
{
winID.close();
}
}
//更改URL网址
function changeURL(newURL)
{
if(winID && winID.open && !winID.closed)
winID.location.href = newURL;
}
</script>
</head>
<body onunload=”closeWindow()”>
<h2>窗口的展开与关闭
<hr />
<form>
<input type=”button” value=”展开窗口” onclick=”openWindow()” />
<input type=”button” value=”关闭窗口” onclick=”closeWindow()” />
<input type=”button” value=”显示性的url”
onclick=”changeU揽胜L(‘yes.html’)” />
<input type=”button” value=”重新新窗口的U途观L”
onclick=”changeUGL450L(‘displayClock.html’)” />
</body>
</html>

function cur(ele){
$(ele).addClass(“cur”).siblings().removeClass(“cur”);
}
function tab(id_tab,tag_tab,id_con,tag_con,act){
$(id_tab).find(tag_tab).eq(0).addClass(“cur”);
$(id_con).find(tag_con).eq(0).show().siblings(tag_con).hide();
if(!act){ act=”click”};
if(act==”click”){
$(id_tab).find(tag_tab).each(function(i){
$(id_tab).find(tag_tab).eq(i).click(function(){
cur(this);
$(id_con).find(tag_con).eq(i).show().siblings(tag_con).hide();
})
})
}
if(act==”mouseover”){
$(id_tab).find(tag_tab).each(function(i){
$(id_tab).find(tag_tab).eq(i).mouseover(function(){
cur(this);
$(id_con).find(tag_con).eq(i).show().siblings(tag_con).hide();
})
})
}
}
$(document).ready(function(){
tab(“#tri”,”li”,”#game_con”,”div”,”click”);
});

调用的话须要那样写:

复制代码 代码如下: !DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0
Transitional//EN” “…

亲自过问代码:运维后,必要刷新下,本领加载jquery

复制代码 代码如下:

  • 百度
  • 剧本之家
  • 服务器软件

  • ·内容baidu.com

$(document).ready(function(){
options={
‘speedIn’:600, //图片步入时候的卡通片速度
‘speedOut’:400, //图片退出时候的动画速度
‘easeIn’:’easeOutBounce’,
//图片步入时候的动画片效果,这几个功效要求easing库
‘easeOut’:” //图片退出时候的卡通片效果
}
$(‘.jcutter’).jCutter(options);
})

内容jb51.net

本来要援用那些插件才行。上面大家来上课那么些插件的编写。
一、jQuery插件编写的主意
写一个jQuery插件,首先须求部分少不了的构造,如下所示:

内容s.jb51.net

复制代码 代码如下:

[Ctrl+A 全选 注:如需引进外界Js需刷新能力推行]

(function($){
$.fn.jCutter = function(o){
o = $.extend({
speedIn: 300,
speedOut: 300,
easeIn: ”,
easeOut: ”
}, o || {});
};
})(jQuery);

复制代码 代码如下: function cur(ele){
$(ele).addClass(“cur”).siblings().removeClass(“cur”); } function
tab(id_tab,tag_tab,id_con,tag_con,act){ $(id_tab).find…

发表评论

电子邮件地址不会被公开。 必填项已用*标注