网页美工设计中jQuery技术的运用

网页美工论文第八篇：网页美工设计中jQuery技术的运用

 

　　摘要：互联网技术的发展, 带来了网页技术的更新换代, 各种创新型技术的引入, 使得网页呈现出更加多样化的表现模式, 传统的网页使用的仅仅是HTML技术, 现代网页则是将HTML+CSS+JAVASCRIPT等多项技术实现了有机的结合。值得一提的是, 最新的JQuery技术算的上是十分科学合理的Java script框架。在大小上来看, 其属于轻量级的js库, 也就是说经过压缩之后其大小仅为21k, 其不仅适用于CSS3, 并且还能够运行各种浏览器。与此同时, 还可以建立起有着“web2.0”特性的富客户端页面, 该页面有着极强的互动性。其便捷高效的查询功能与各种各样的插件, 使其广泛运用于网页美工设计之中。

 

　　关键词：网页美工; jQuery技术; JavaScript;

 

　　JQuery作为一个业界广为流传的Java Script代码库, 有其特有的优势, 其不仅对用户免费而且实现全面的开源。其影响力丝毫不逊于其先驱prototype, JQuery的类库虽然较小但是种类齐全, 其也正在俘获更多网页美工设计者的芳心。

 

　　j Query始终都在坚持“Writeless, Do More”的理念, 主张尽可能使用简洁的语法结构来处理HTML documents、events等, 而且还要使得Ajax交互能够流畅的运行。不仅如此, j Query还为使用者带来了更多功能齐全的插件, 它们操作简单而且还能给用户带来不一样的视觉冲击。

 

　　一、j Query使用环境搭建

 

　　如上文所言, j Query属于一种轻量级的js库, 其还能运行CSS3以及各类浏览器。操作者只要把它插入HTML源文件或者CSS样式表中就可以了, 但值得注意的是, 它必须要与JQuery库保持流畅的通讯交互。文章由于篇幅有限, 就只是详细论述一下使Dreamweaver支持j Query自动显示代码功能的流程。如果要实现该功能就必须要借助一个新的插件, 那就是j Query API.mxp。之后打开Dreamweaver的界面, 然后在里面找到“命令”按钮, 点选, 之后依次选择“扩展管理”与“安装扩展”, 然后系统将会实现自动安装。最后做的一个工作就是重启Dreamweaver。

 

　　二、j Query语法简介

 

　　1、JQuery精准简单的选择器。我们所熟知的prototype与DWR都是借用常见的“$”来表示document.get Element By Id () 命令。j Query不仅能够实现这点, 而且还具有一些其他的拓展功能。j Query语言在点选目标时方便快捷, 而且精度极高, 使用者能够快速选取DOM中任意因子, 这也正体现了j Query最初的设计理念。2、j Query对象。j Query对象函数基本不要求太多的专业培训就可进行操作, 并且流程更加简洁, 适用范围更广。3、j Query的事件机制。运用j Query工具能够让java script与html两个代码分开, 能够很容易锁定事件, 很好的保证其清洁明。4、j Query插件。j Query的插件中有一些功能比较强大。几乎都以清新、简单著称, 运用起来十分便捷。

 

　　三、j Query技术在网页美工中的应用

 

　　对于很多程序开发人员而言, j Query改变了他们书写Java Script的习惯。下面文章将介绍一些特殊的功能, 希望你能有所启发。1、基于j Query实现的Ajax异步分页。j Pages插件的功能就是对客户端进行分页, 这其中就有很多独特之处, 比如一定时间后进行自动播放等。2、老牌的响应式j Query幻灯片效果。对于一些资深的程序研发人员来说, Slides JS无疑是一个再熟悉不过的Query幻灯片插件了, 其自从被研发至今, 经过多次改良已然变成了一个功能强大、设计精密的幻灯片插件。其能够实现循环、自动播放与渐入渐出等功能, 不仅如此, 其还可以进行自动分页, 基于这些功能, 研发人员可以拼凑出各种精美的幻灯片效果。3、模态窗口, 工具提示和消息效果。j Box同样也是一款功能强大的j Query插件, 它能够表达的功能有模态窗口, 工具提示等。使用者能够借助j Query选择器十分简洁的将工具提示效果使用到元素上, 借助类似的操作流程, 也可以对模态窗口进行重置。4、视差滚动在图片滑块中的应用。在当前的网页设计中, 视差滚动 (Parallax Scrolling) 的使用频率依然算是相当之高了, 通过运用这种技术, 原本静态的网页就会立马产生动态立体的效果。5、实现各种动感十足的文本动画。该插件将诸多优良的Java Script库融为一体, 打造了一个便捷的文本动画插件, 由此, 网页内的文字也能够以各种动画的效果展示出来了。6、动感的页面加载动画效果。当界面开始读取全新的内容时, 形状就会通过动画的形式返回显示的界面。此时, 就会使用一种新的Snap.svg动画库来达成目标, 借助这个Snap.svg动画库, 使用者可以很便捷的构造各种复杂形状和趣味十足的转换效果。

 

　　结束语:j Query这种Java Script代码库是近些年才研发出来的, 它的类库运用起来十分便捷, 插件不仅具有很强的观赏性而且功能强大, 故而被广泛运用于网页美工行业。文章开篇论述了JQuery如何被运用于网页制作之中, 之后讲述了一些笔者结合多年工作经验, 对如何在网页美工中使用j Query提出的一些建议。进行网页美工设计时, 不仅需要研发者拥有沉着的心境和独到的审美, 还需要在实践基础之上的设计灵感, j Query的奥义博大精深。

 

　　参考文献

 

　　[1]闫一帆, 沈斐斐.j Query技术在网页美工中的应用[J].信息与电脑:理论版, 2011 (6) :173-173.

　　[2]林振文.网页美工中j Query技术的应用研究[J].计算机光盘软件与应用, 2015 (1) :224-225.

　　[3] 胡安明.j Query在《网页设计》课程中的运用[J].计算机光盘软件与应用, 2011 (10) :234-234.