开发中可能会用到的几个 jQuery 小提示和技巧
今天,我们将分享一些很有用的技巧和窍门给 jQuery 开发人员。jQuery 是最好的 JavaScript 库之一,用于简化动画,事件处理,支持 Ajax 和 HTML 的客户端脚本。网络中有大量的 jQuery 插件,有助于在短时间内通过简单容易的方法创建网站。
今天我们选取了几个队 jQuery 开发人员非常有用的代码片段。希望你的下一个项目中能用得上这些代码。
1) 禁止右键
在开发 Web 应用的时候,有些情况需要禁用右键单击功能。使用此代码,jQuery 开发人员可以在网页上禁用鼠标右键点击。代码如下:
$(document).ready(function() {
//catch the right-click context menu
$(document).bind("contextmenu",function(e) {
//warning prompt - optional
alert("No right-clicking!"); //delete the default context menu
return false;
});
});
2) 文本缩放
使用下面的代码,用户可以更具需要增大或者缩放网页中的字体大小,代码如下:
$(document).ready(function() {
//find the current font size
var originalFontSize = $('html').css('font-size'); //Increase the text size
$(".increaseFont").click(function() {
var currentFontSize = $('html').css('font-size');
var currentFontSizeNumber = parseFloat(currentFontSize, 10); var newFontSize = currentFontSizeNumber*1.2;
$('html').css('font-size', newFontSize);
return false;
}); //Decrease the Text Size
$(".decreaseFont").click(function() {
var currentFontSize = $('html').css('font-size');
var currentFontSizeNum = parseFloat(currentFontSize, 10); var newFontSize = currentFontSizeNum*0.8;
$('html').css('font-size', newFontSize);
return false;
}); // Reset Font Size
$(".resetFont").click(function(){
$('html').css('font-size', originalFontSize);
});
});
3) 在新窗口打开链接
使用这个 jQuery 代码,用户会点击你的网站的任何链接都会在新的窗口中打开。如下:
$(document).ready(function() {
//select all anchor tags that have http in the href
//and apply the target=_blank
$("a[href^='http']").attr('target','_blank');
});
4) 样式表切换
你知道网站换肤是怎么做的吗?下面的代码可以帮助你实现样式表切换功能,如下:
$(document).ready(function() {
$("a.cssSwap").click(function() {
//swap the link rel attribute with the value in the rel
$('link[rel=stylesheet]').attr('href' , $(this).attr('rel'));
});
});
5) 回到顶部
这是现在网站中很常用的回到顶部功能,特别适合页面很长的情况。代码很简单,如下:
$(document).ready(function() {
//when the id="top" link is clicked
$('#top').click(function() {
//scoll the page back to the top
$(document).scrollTo(0,500);
}
});
6) 获取鼠标的 X、Y 坐标
下面的代码可以获取鼠标的 X,Y 坐标,代码如下:
$().mousemove(function(e){
//display the x and y axis values inside the P element
$('p').html("X Axis : " + e.pageX + " | Y Axis " + e.pageY);
});
7) 检测当前鼠标的坐标
使用下面的代码,能够在任何支持 jQuery 的地方获取当前鼠标的坐标,如下:
$(document).ready(function() {
$().mousemove(function(e){
$('# MouseCoordinates ').html("X Axis Position = " + e.pageX + " and Y Axis Position = " + e.pageY);
});
8) 预加载图片
这个图片预加载片段让你能够快速的预先载入图片,不需要等待。代码如下:
jQuery.preloadImagesInWebPage = function() {
for(var ctr = 0; ctr<arguments.length; ctr++){
jQuery("").attr("src", arguments[ctr]);
}
}
调用方法:
$.preloadImages("image1.gif", "image2.gif", "image3.gif");
判断图片是否已加载:
$('#imageObject').attr('src', 'image1.gif').load(function() {
alert('The image has been loaded…');
});
本文链接:Web 开发中实用的几个 jQuery 提示和技巧
编译来源:梦想天空 ◆ 关注前端开发技术 ◆ 分享网页设计资源
本文来自【梦想天空(http://www.cnblogs.com/lhb25/)】
开发中可能会用到的几个 jQuery 小提示和技巧的更多相关文章
- 开发中可能会用到的几个 jQuery 小提示和技巧(转)
今天,我们将分享一些很有用的技巧和窍门给 jQuery 开发人员.jQuery 是最好的 JavaScript 库之一,用于简化动画,事件处理,支持 Ajax 和 HTML 的客户端脚本.网络中有大量 ...
- 开发中可能会用到的几个 jQuery 小提示和技巧 (转)
转自:http://www.cnblogs.com/lhb25/p/useful-jquery-tips-and-tricks.html 今天,我们将分享一些很有用的技巧和窍门给 jQuery 开发人 ...
- u3d开发中可能会遇到的设计模式
最近一段时间,面试了一些程序员,当然主要招聘的岗位是Unity3D开发.面试过程中对于三年以上的程序员我都会问其在开发中是否会总结一些常用的设计模式和设计方法,当然目的只是想了解程序员的自我学习情况以 ...
- Cocos开发中可能会遇到的问题
开发中碰到的问题及解决方案: 1:场景工程中没有被依赖关联的图片声音或者其它资源,导出到微信后找不到 有些在场景工程中没有指定而通过代码中动态加载的资源,cocos creator不会导出到发布目 ...
- C#开发中可能会用到的一些小贴士(转)
转至http://www.cnblogs.com/Ebony-Ivory/p/4380106.html C#篇: 1.目标平台的选择 64位操作系统在编译VS里的程序时,根据需要设置项目属性的“目标平 ...
- 开发中可能会用到的几个小tip----QT, pycharm, android, 等
QT: 如果是在windows下开发的话,添加外部库,外部包含头文件路径的时候,要注意用相对路径,或者在项目上右键添加外部库的路径或者头文件路径,否则,会卡在这里开始怀疑人生... 如果是在linux ...
- ios开发之--开发中可能会用到的一些函数
rand() ----随机数 abs() / labs() ----整数绝对值 fabs() / fabsf() / fabsl() ----浮点数绝对值 floor() / floorf() / f ...
- iOS开发之-收集的不常用却实用的小方法和技巧
原文链接:http://blog.5ibc.net/p/90386.html 1.颜色转变成图片 - (UIImage *)createImageWithColor:(UIColor *)color ...
- TDD在Unity3D游戏项目开发中的实践
0x00 前言 关于TDD测试驱动开发的文章已经有很多了,但是在游戏开发尤其是使用Unity3D开发游戏时,却听不到特别多关于TDD的声音.那么本文就来简单聊一聊TDD如何在U3D项目中使用以及如何使 ...
随机推荐
- JSON学习之二
1.JSON语法是JavaScript对象表示法的子集,语法规则: **数据在名称/值对中 **数据由逗号分隔 **花括号保存对象 **方括号保存数组 2.JSON名称/值对:JSON数据的书写格式是 ...
- Ext.util.TaskRunner定时执行任务
Ext.util.TaskRunner能够提供多线程的定时任务,该类提供了对多线程任务的管理,可以通过Ext.TaskManager来创建Ext.util.TaskRunner的一个实例,也可以自行创 ...
- C++程序员们,快来写最简洁的单例模式吧
想必每一位程序员都对设计模式中的单例模式非常的熟悉吧,以往我们用C++实现一个单例模式需要写以下代码: class CSingleton { private: CSingleton() //构造函数是 ...
- struts2结果(Result)
一.结果(result)类型 result的type属性默认为dispatcher,其他常见的属性有redirect\chain\redirectAction <action name=&quo ...
- Windows编程中UNICODE和_UNICODE定义问题
Windows编程中UNICODE和_UNICODE定义问题 先转一篇文章: 初学Windows SDK编程时碰到过这个问题,相信很多初学Windows编程的人也都碰到过,后来慢慢搞明白些了,但有时别 ...
- PHP面试出场率较高的题目<转载>
--------------------PHP部分--------------------- PHP中几个输出函数echo,print(),print_r(),sprintf(),var_dump() ...
- 15 Best Responsive HTML5 Frameworks 2014
Best HTML5 frameworks are most popular because with the use of these frameworks you can create websi ...
- Java开发中的高频Collections用法总结与Java平台实现源代码查看方式
一生二,二生三,三生万物,基础永远是一个计算机人的立身之本,相信看到这篇文章的人一般都知道数据结构这门课程,要不也不会找到我的这篇文章.数据结构这门课程的分析奠定了工程师对各种平台中的容器类,集合类的 ...
- NPOI导入导出EXCEL通用类,供参考,可直接使用在WinForm项目中
以下是NPOI导入导出EXCEL通用类,是在别人的代码上进行优化的,兼容xls与xlsx文件格式,供参考,可直接使用在WinForm项目中,由于XSSFWorkbook类型的Write方法限制,Wri ...
- 【Swift学习】Swift编程之旅---可选链(二十一)
可选链Optional Chaining是一种可以在当前值可能为nil的可选值上请求和调用属性.方法及下标的方法.如果可选值有值,那么调用就会成功:如果可选值是nil,那么调用将返回nil.多个调用可 ...