Dec122022
使用jQuery实现滑动门效果，提升页面可访问性！
滑动门效果是一种常见的页面元素交互效果，通过使用jQuery库，我们可以简单地实现一个滑动门效果，并且提升页面的可访问性。
什么是滑动门效果？
滑动门效果是指在网页中，当鼠标指针悬停在一个菜单项上时，该菜单项的背景色会以滑动的动画效果展示出来。这种效果能够提升用户体验，增加页面的动感和交互性。
使用jQuery实现滑动门效果
首先，你需要包含jQuery库到你的网页中。你可以通过...阅读全文
抢沙发
Nov252022
如何通过jQuery实现图片懒加载的懒加载
图片懒加载是一种优化网页性能的常用技术之一。通过在图片进入可视区域之前不加载图片，在图片进入可视区域后再加载，可以大大减少页面的加载时间和流量消耗。本文将介绍如何使用jQuery来实现图片懒加载。
什么是图片懒加载？
图片懒加载又被称为延迟加载，是一种在需要用到某个资源时才进行加载的技术。对于网页中的图片，通常情况下用户需要滚动页面才能看到图片。传统的加载方式会导致...阅读全文
Nov062022
使用jQuery开发交互式网页
在现代Web开发中，交互式网页已经成为必不可少的一部分。而jQuery作为最受欢迎的JavaScript库之一，为我们提供了丰富的工具和功能，帮助我们快速构建交互式网页。本文将介绍一些jQuery的常用功能和技巧，以帮助你更好地开发交互式网页。
1. 引入jQuery库
首先，在开发交互式网页之前，我们需要在页面中引入jQuery库。你可以从jquery.com官方网站上下载最新版本的jQuery文件。
<script ...阅读全文
Oct282022
使用jQuery实现图片放大镜效果
图片放大镜效果是网页设计中常用的特效之一，它可以让用户在鼠标悬停在图片上时放大图片的细节部分，提供更好的视觉体验。在本篇博客中，我们将使用jQuery库来实现这一效果。
准备工作
首先，我们需要引入jQuery库。你可以从官方网站上下载最新版本的jQuery，并将其引入到你的HTML文件中。
<script src="jquery.js"></script>
接下来，我们准备一张图片。
<img id="image...阅读全文
Sep302022
如何利用 jQuery 修改 css 中带有 !important 的样式属性？
外部样式为：
div.test {
width:auto !important;
overflow:auto !important
}
通过 $(“div.test”).css(“width”,”100px”); 和 $(“div.test”).css(“width”,”100px !important”); 是无效的
要想修改 div 的 width，可以通过如下这种方式：
$("div.test").css("cssText", "width:650px !important;");
要想...阅读全文
Sep132022
jquery+html+php 实现Ajax无刷新文件上传
以下内容所讲的方法是通过jquery的插件实现，纯jquery原生的实现方法请参考：
使用jquery ajax实现文件上传
利用 php+jquery+html 实现 ajax 无刷新文件上传。这里主要用到了一款 jquery 插件（也可称作 ajax 文件上传组件）ajaxfileupload。这个插件实际上是采用了 iframe 文件上传的原理，即动态的再页面里嵌入了一个IFRAME表单，然后在IFRAME使用原生的POST表单提交数据。下面以做一个...阅读全文
Sep132022
使用jquery ajax实现文件上传
使用jquery ajax实现文件上传，只贴关键代码。
html 代码：
<input type="file" id="phpernote_pop_uploadfile" multiple />
javascript 代码：
$('body').on('change', '#phpernote_pop_uploadfile', function () {
var file = new FormData;
file.append('file', $('#phpernote_pop_uploadfile')[0].files[0]);
$.ajax({
url: 'http://localhost:8051/',
...阅读全文
Aug132022
jQuery插件jquery.lazyload.js实现图片懒加载
逻辑：引入jquery.js库和jquery.lazyload.min.js插件，在当前页需要懒加载的图片标签里面添加lazy类和data-original属性，在页尾script地方调用$(“img.lazy”).lazyload();即可。
STEP1：引入资源
<!--页尾引入js文件-->
<script type="text/javascript" src="/js/jquery.min.js"></script>
<script type="text/javascript" src="/js/jquery.lazyload.min...阅读全文
Mar102022
学习使用jQuery快速开发交互式网页
在现代的网页开发中，交互性是至关重要的。而要实现交互式网页，我们通常需要使用JavaScript编写大量的代码。然而，为了简化开发过程并提高效率，我们可以选择使用流行的JavaScript库 – jQuery。本文将介绍如何学习使用jQuery来快速开发交互式网页。
什么是jQuery？
jQuery 是一款快速、简洁且功能丰富的JavaScript库。它使我们能够使用更少的代码来实现常见的网页交互效果，如动态...阅读全文
Mar072022
