jquery插件学习笔记
chenqiong1991
这个作者很懒,什么都没留下…
展开
-
jquery为元素绑定事件
写在前面为HTML元素绑定新的事件。代码<button id="bind_button">绑定单击事件</button><div id="log">日志记录:</div><script> function myBindFunc(e) { $("#log").html($("#log").html()+"<p>"+e.data.d1+e.data.d2+"</p>");原创 2017-04-08 22:00:02 · 266 阅读 · 0 评论 -
jquery插件开发学习笔记(二)
写在前面我认为,今天的这个插件在写法上已经比较符合jquery插件开发的“正统”流程。在各个方面都考虑得比较完善。习惯了这种思路之后,对于开发功能完备的插件是大有帮助的。 相比较与第一个插件来说,插件主体区和功能区分离是最大的特点。另外,进过两个小时的bug分析,得出了惨痛的参数传递的方法(目前觉得还太高深,不是吾辈理解之)。包裹(function($){ //code goes here原创 2017-03-19 14:50:27 · 540 阅读 · 0 评论 -
jquery插件开发学习笔记(三)
写在前面复习写插件的一些基本步骤。勿忘之。代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>jquery插件学习---1</title> <script src="../../lib/jquery/jquery.js"></script></head><body><p id="原创 2017-03-29 21:19:29 · 306 阅读 · 0 评论 -
jquery插件开发学习笔记(四)——导航栏特效
写在前面想法是:对于一个导航栏,鼠标悬浮于某一项上时,该项高亮,兄弟项正常。鼠标位于导航栏之外时,所有项目正常。关键代码<ul> <li id="test_1"><a href="">home</a></li> <li><a href="">java</a></li> <li><a href="">javascript</a></li></ul> m原创 2017-03-30 20:53:11 · 299 阅读 · 0 评论 -
jquery插件开发学习笔记(五)——动态选择触发器
写在前面想实现这样的功能:在前面触发某个对象切换隐藏和显示的功能中,在不刷新网页的情况下,可以动态地切换触发器。原理是有两个单选按钮,提供两个触发器。用户可以选择单选按钮来触发。 目前,可以利用单选按钮来切换,但得依靠刷新网页。 还没找到解决方案。 to be continued… 以后总会有方法的。代码<form action=""> <input type="radio" nam原创 2017-03-31 21:56:40 · 449 阅读 · 0 评论 -
jquery插件开发学习笔记(六)——页面平滑滚动
写在前面看教科书案例。代码抄的。但原代码未实现需求功能。改动之。 现分析之。关键代码<div class="scrollnav" id="scrollnav"> <a href="#" page-scroll="#scrolltoTop" id="scrolltoTop">滑动到顶端</a><br><br><br><br><br><br><br><br><br><br><br><br><b原创 2017-04-01 21:52:37 · 462 阅读 · 0 评论 -
jquery插件开发学习笔记(七)——页面平滑滚动改进
写在前面放假了。放松一天。虽然也没干什么事。三天的假期:过完一天是一天。呵呵。 把昨天的代码稍微改了一下,使其更符合自己的逻辑,毕竟原文中的page-scroll的自定义属性是个什么鬼(os:HTML的标签的属性可以自定义的吗?不知道。以后会知道的)。直接用id来定位元素了。代码$(document).ready(function () { jQuery.scrollTo=func原创 2017-04-02 22:06:24 · 356 阅读 · 0 评论 -
jquery导航栏特效
写在前面用简单的另一种方法实现导航栏滑动特效。代码.line { float: none; position: absolute; left: 0; height: 3px; width: 0; padding: 0; backgro原创 2017-04-04 20:46:32 · 838 阅读 · 0 评论 -
浏览器的鼠标坐标值获取及pageX、clientX、screenX的差异
写在前面获取方法比较简单。重点在于理解三种值的实际意义。代码<p><strong>screen:</strong><span id="screen"></span></p><p><strong>client:</strong><span id="client"></span></p><p><strong>page:</strong><span id="page"></span></p> 三个原创 2017-04-05 21:30:34 · 1676 阅读 · 0 评论 -
提示文本的隐藏与显示
写在前面这个功能类似于HTML标签的placeholder属性。不同之处在于,placeholder只有在标签获得焦点并输入非空字段时,它的文字才会消失,而此功能只要标签获得焦点就会显示,而一旦失去焦点就会消失。核心代码 $(document).ready( function () { $("#search").focus(function () {原创 2017-04-06 21:42:57 · 379 阅读 · 0 评论 -
定时器设置与取消
写在前面通过JavaScript原生的setInterval()和clearInterval()设置一个定时器和取消该定时器,从而控制页面自动生成一些内容并提供停止的功能。代码<p id="para">para:</p><button>stop</button><script> function add() { $("#para").append("add <strong原创 2017-04-10 22:04:18 · 2438 阅读 · 0 评论 -
jquery插件开发学习笔记(一)
写在前面看到很多用jquery写的各种小插件,很感兴趣,尝试自己写一个。这是根据网上的资料做的一个具有传递参数的一个具备了基本功能的插件。引入jquery<script src="../lib/jquery/jquery.js"></script>定义插件$.fn.myPlugin=function(){};使用插件$("p").myPlugin();//p标签使用插件插件代码this.css("c原创 2017-03-17 21:21:37 · 530 阅读 · 0 评论