存档

‘javasript’ 分类的存档

分享9个单页面网站开发必备jQuery插件

2012年8月7日 没有评论

单页面网站作为简单快捷,易于维护的页面设计方案,越来越受到工作室,作品集,或者个人博客类网站用户的青睐,我们可以使用不同的特效来使得页面更加的丰富和炫动,今天我们将介绍几款可以作为单页面开发的jQuery插件,帮助大家快速简便的实现一个单页面的网站设计,希望大家喜欢!

jQuery one page nav

使用这个插件,可以帮助你快速的搭建一个滚动的页面导航,如果你需要比较简单直接的方式开发一个单页面的网站,这个插件是一个不错的选择。

分享9个单页面网站开发必备jQuery插件

jQuery ScrollPath

jQuery ScrollPath是一个非常棒的插件,允许你画出自己自定义的滚动路径。HTML元素可以被放置到路径上,而且类似的鼠标滚轮,键盘上下移动键,或者空格都可以帮助你移动到你需要到达的元素位置。并且一个可选的自定义滚动条可以帮助你方便的点击和拖拽滚动。而且插件允许你使用CSS变形旋转整个页面。

分享9个单页面网站开发必备jQuery插件

Ascensor.js

使用这个jQuery插件可以帮助我们定位页面任何内容块到画布,并且可以使用键盘来浏览。而且这个部分可以被上下左右的导航和浏览。

分享9个单页面网站开发必备jQuery插件

Curtain.js

curtain.js是一个用来使用自定义的窗帘效果显示多个固定面板的jquery插件,拥有非常棒的滚动特效。

分享9个单页面网站开发必备jQuery插件

Zoonooz.js

一个缩放的插件,但是可以用来定位单页面中的不同区域

分享9个单页面网站开发必备jQuery插件

Pagify.js

这个插件可以用来创建单页面的网站,这个插件的实现方式是将不同菜单中的内容保存到不同HTML文件中,并且通过定义的div来加载不同的菜单项内容。

分享9个单页面网站开发必备jQuery插件

JustaPage

Justapage不仅仅是一个插件,还是一个用来设计单页面网站的模板,这个模板是跨浏览器兼容的,并且支持移动设备!

分享9个单页面网站开发必备jQuery插件

SuperScrollrama

这个超棒的插件可以帮助你生成视差滚动特效,如果你希望你的网站更酷一些,那么就整合这个插件吧!

分享9个单页面网站开发必备jQuery插件

Waypoints

Waypoints可以用作页面内滚动操作的单页面导航设计插件。它可以让你方便的处理页面滚动事件,你可以比较自由的在自己的UI中使用这个插件控制页面滚动事件。

分享9个单页面网站开发必备jQuery插件

来源:分享9个单页面网站开发必备jQuery插件



分类: javasript, Jquery, 网摘 标签:

最全介绍Document对象内容集合

2010年6月19日 没有评论

document 文挡对象 – JavaScript脚本语言描述
———————————————————————
  注:页面上元素name属性和JavaScript引用的名称必须一致包括大小写
  否则会提示你一个错误信息 “引用的元素为空或者不是对象\\\\\”
  ———————————————————————
  对象属性
  document.title //设置文档标题等价于HTML的title标签
  document.bgColor //设置页面背景色
  document.fgColor //设置前景色(文本颜色)
  document.linkColor //未点击过的链接颜色
  document.alinkColor //激活链接(焦点在此链接上)的颜色
  document.vlinkColor //已点击过的链接颜色
  document.URL //设置URL属性从而在同一窗口打开另一网页
  document.fileCreatedDate //文件建立日期,只读属性
  document.fileModifiedDate //文件修改日期,只读属性
  document.fileSize //文件大小,只读属性
  document.cookie //设置和读出cookie
  document.charset //设置字符集 简体中文:gb2312
  ———————————————————————
  常用对象方法
  document.write() //动态向页面写入内容
  document.createElement(Tag) //创建一个html标签对象
  document.getElementById(ID) //获得指定ID值的对象
  document.getElementsByName(Name) //获得指定Name值的对象
  document.body.appendChild(oTag)
  ———————————————————————
  body-主体子对象
  document.body //指定文档主体的开始和结束等价于body>/body>
  document.body.bgColor //设置或获取对象后面的背景颜色
  document.body.link //未点击过的链接颜色
  document.body.alink //激活链接(焦点在此链接上)的颜色
  document.body.vlink //已点击过的链接颜色
  document.body.text //文本色
  document.body.innerText //设置body>…/body>之间的文本
  document.body.innerHTML //设置body>…/body>之间的HTML代码
  document.body.topMargin //页面上边距
  document.body.leftMargin //页面左边距
  document.body.rightMargin //页面右边距
  document.body.bottomMargin //页面下边距
  document.body.background //背景图片
  document.body.appendChild(oTag) //动态生成一个HTML对象
  常用对象事件
  document.body.onclick=”func()” //鼠标指针单击对象是触发
  document.body.onmouseover=”func()” //鼠标指针移到对象时触发
  document.body.onmouseout=”func()” //鼠标指针移出对象时触发
  ———————————————————————
  location-位置子对象
  document.location.hash // #号后的部分
  document.location.host // 域名+端口号
  document.location.hostname // 域名
  document.location.href // 完整URL
  document.location.pathname // 目录部分
  document.location.port // 端口号
  document.location.protocol // 网络协议(http:)
  document.location.search // ?号后的部分
  documeny.location.reload() //刷新网页
  document.location.reload(URL) //打开新的网页
  document.location.assign(URL) //打开新的网页
  document.location.replace(URL) //打开新的网页
  ———————————————————————
selection-选区子对象
  document.selection

  ———————————————————————

  images集合(页面中的图象)

  a)通过集合引用

  document.images //对应页面上的img标签

  document.images.length //对应页面上img标签的个数

  document.images[0] //第1个img标签

  document.images[i] //第i-1个img标签

  b)通过nane属性直接引用

  img name=”oImage”

  document.images.oImage //document.images.name属性

  c)引用图片的src属性

  document.images.oImage.src //document.images.name属性.src

  d)创建一个图象

  var oImage

  oImage = new Image()

  document.images.oImage.src=”1.jpg”

  同时在页面上建立一个img /标签与之对应就可以显示

  ———————————————————————-

  forms集合(页面中的表单)

  a)通过集合引用

  document.forms //对应页面上的form标签

  document.forms.length //对应页面上/formform标签的个数

  document.forms[0] //第1个/formform标签

  document.forms[i] //第i-1个/formform标签

  document.forms[i].length //第i-1个/formform中的控件数

  document.forms[i].elements[j] //第i-1个/formform中第j-1个控件

  b)通过标签name属性直接引用

  /formform name=”Myform”>input name=”myctrl”/>/form

  document.Myform.myctrl //document.表单名.控件名

  c)访问表单的属性

  document.forms[i].name //对应form name>属性

  document.forms[i].action //对应/formform action>属性

  document.forms[i].encoding //对应/formform enctype>属性

  document.forms[i].target //对应/formform target>属性

  document.forms[i].appendChild(oTag) //动态插入一个控件

  document.all.oDiv //引用图层oDiv

  document.all.oDiv.style.display=” //图层设置为可视

  document.all.oDiv.style.display=”none” //图层设置为隐藏

  document.getElementId(”oDiv”) //通过getElementId引用对象

  document.getElementId(”oDiv”).style=”

  document.getElementId(”oDiv”).display=”none”

  /*document.all表示document中所有对象的集合
  只有ie支持此属性,因此也用来判断浏览器的种类*/
  图层对象的4个属性
  document.getElementById(”ID”).innerText //动态输出文本
  document.getElementById(”ID”).innerHTML //动态输出HTML
  document.getElementById(”ID”).outerText //同innerText
  document.getElementById(”ID”).outerHTML //同innerHTML



分类: javasript 标签:

window对象详解

2010年4月28日 没有评论

注:页面上元素name属性和JavaScript引用的名称必须一致包括大小写
否则会提示你一个错误信息 “引用的元素为空或者不是对象”

对象属性
window                    //窗口自身
window.self                //引用本窗口window=window.self
window.closed            //表示窗口是否已经关闭
window.name            //为窗口命名
window.defaultStatus  //设定窗口状态栏信息
window.location        //URL地址,设置这个属性可以打开新的页面
———————————————————————

对象方法
window.alert(“text”)                      //提示信息对话框
window.confirm(“text”)                  //确认对话框
window.prompt(“text”)                  //要求键盘输入对话框
window.setIntervel(“action”,time)    //每隔指定的时间(毫秒)就执行一次操作
window.clearInterval()                    //清除时间设置作用就是终止循环
window.setTimeout(action,time)    //隔了指定的时间(毫秒)执行一次操作
window.open()                            //打开新的窗口
window.close()                            //关闭脚本所在窗口
———————————————————————

成员对象
window.event
window.document  //见document对象详解
window.history
window.screen
window.navigator
window.external
———————————————————————

window.history对象
window.history.length  //浏览过的页面数
history.back()        //后退
history.forward()      //前进
history.go(i)          //到历史清单的第i位
                      //i>0前进,i<0后退
———————————————————————

window.screen对象
window.screen.width        //屏幕宽度
window.screen.height      //屏幕高度
window.screen.colorDepth  //屏幕色深
window.screen.availWidth  //可用宽度
window.screen.availHeight  //可用高度(除去任务栏的高度)
———————————————————————

window.external对象
window.external.AddFavorite(“地址”,”标题” )  //把网站添加到收藏夹
———————————————————————

window.navigator对象
window.navigator.appCodeName      //浏览器代码名
window.navigator.appName          //浏览器程序名
window.navigator.appMinorVersion  //浏览器补丁版本
window.navigator.cpuClass        //cpu类型 x86
window.navigator.platform        //操作系统类型 win32
window.navigator.plugins
window.navigator.opsProfile
window.navigator.userProfile
window.navigator.systemLanguage  //客户系统语言 zh-cn简体中文
window.navigator.userLanguage    //用户语言,同上
window.navigator.appVersion      //浏览器版本(包括系统版本)
window.navigator.userAgent
window.navigator.onLine          //用户否在线
window.navigator.cookieEnabled    //浏览器是否支持cookie
window.navigator.mimeTypes       
———————————————————————


<!--window对象方法示例脚本-->
<script language="javascript">
window.alert("您好!")
</script>
<script language="javascript,">
var action
action=window.confirm("请选择操作...")
if(action)
document.write("您选择了继续操作")
else
document.write("您选择了取消操作")
</script>
<script language="javascript">
var info
info=window.prompt("请输入一些必要的信息")
document.write (info)
</script>
<script language="javascript">
var i;i=0;
function action(){
i++;
window.alert(i) //监视循环情况
if(i>=10)
window.clearInterval(stop) //终止循环
}
stop=window.setInterval("action()",1000)//1000毫秒=1秒
</script>
<script language="javascript">
var i;i=0;
function action(){
i++;
window.alert(i) //监视循环情况
}
window.setTimeout("action()",1000)
//相同的代码setTimeout只执行一次
</script>



分类: javasript 标签: , ,

无觅相关文章插件,快速提升流量

互联网安全