QQ 1640076782

2014年07月29日

jQuery三种常用选项卡

Filed under: 英语网站设计 — 标签： — limeng @ 7:59 上午

鼠标点击切换选项卡 鼠标点击才会切换，划过没有任何效果 function selectTag(showContent,selfObj){ // 操作标签 var tag = document.getElementById(“tags”).getElementsByTagName(“li”); [...]

2014年07月28日

让文字自动缩短的Jquey 插件- Ellipsis

Filed under: 英语网站设计 — 标签： — lifengwu @ 9:54 上午

这个插件允许缩短您的文字，如果它很长的话。原来的文本可以通过鼠标悬停再完一显示出来。这是一个简单但非常有用的插件 下面我们来看看使用这个插件的效果，正常的： 引入这个插件之后： 鼠标经过时候和效果： 因为是插件，引入Jquery当然是必须的，这里需要首先引入jquery库jquery.js,还需要引入这个插件的ellipsis.js 最后还需要调用才会有效果的，调用代码： <script> (function($) { $(“.first-text”).ellipsis(30); [...]

2014年07月25日

jQuery 几种常见的滚动

Filed under: 英语网站设计 — 标签： — limeng @ 9:45 上午

1. 带箭头左右滚动-缓动 不限制图片数 function $get(id){return document.getElementById(id)}; //不可少 var MarqueeDiv2Control=new Marquee(“MarqueeDiv2″); [...]

2014年07月19日

jQuery几种常见导航制作

Filed under: 英语网站设计 — 标签： — limeng @ 1:19 上午

1. 点击折叠，不可自动折叠树形导航 鼠标点击加号，上面已经展开的子目录不会自动弹回去 js树形导航菜单制作点击展开收缩二级菜单 function getObject(objectId){ if(document.getElementById && document.getElementById(objectId)){ return [...]

2014年07月2日

jQuery头部固定，不随滚动条滚动的代码

Filed under: 英语网站设计 — 标签： — limeng @ 3:18 上午

1.网页头部部分不随滚动条而滚动，并且不会出现跳动的情况，兼容主流浏览器 window.onscroll=function(){ if ($(document).scrollTop() > 100) { //$(“#pf_nav”).show(); $(“.pf”).addClass(‘float’); }else{ [...]

2014年06月30日

外贸网站建设过程中常用Jquery小技巧

Filed under: 英语网站设计 — 标签： — lifengwu @ 10:19 上午

1、禁止右键 有些时候，客户需要禁用右键单击功能，以加大他人另存图片的难度。使用此代码，可以在网页上禁用鼠标右键点击。 代码如下： $(document).ready(function() { //catch the right-click context menu [...]

2014年06月28日

Jquery jcarousellite.js 图片自动滚动效果

Filed under: 英语网站设计 — 标签：, , — lifengwu @ 4:40 上午

对于常做外贸购物网站的人来说，jcarousellite.js对我们来说并不陌生，因为在产品详细页我们会经常用到这个js来展示产品的细节图。通常情况下，如果产品的细节图过多，我们会通过鼠标左右点击来展示更多的图片，那如果要想所有的细节图都自动滚动该如何来实现呢？其实只要我们理解了jcarousellite.js的各项参数的实际含义，实现起来就相对容易了！首先我们来看看它的各项参数的作用。 参数说明： btnPrev string 上一个按钮的class名, 比如 btnPrev: “.prev” btnNext string [...]

2014年05月30日

纯CSS实现立体文字效果

Filed under: 英语网站设计 — 标签：, — lifengwu @ 10:49 上午

通常情况下，要想实现立体字效果，我们最先想到的肯定是通过PS做成图片，现在我们来看看直接通过CSS实现立体文字的效果。主要是利用text-shadow特性实现效果。 html的全局设置： body{ background-color: #111; } @import url(http://fonts.googleapis.com/css?family=Dosis:500,800); .text { [...]

2014年04月28日

jQuery 实现文字弧形/扇形/圆形排列

Filed under: 英语网站设计 — 标签：, — lifengwu @ 10:12 上午

在网站设计过程中，有时会将文字呈弧形/扇形/圆形排列，这个时候我们用的最多的就是PS里面文字变形工具，一串文字可能变成弧形/扇形/圆形排列等形状，也可以变成波浪形等，现在我们来看看直接通过jQuery将网页里面的文字变成不同的形状： 实现这样的效果，jQuery当然是必不可少的， <script src=”bjs/jquery.min.js”></script> <script src=”bjs/plugins.js”></script> <script src=”bjs/circletype.js”></script> <script> $(‘#demo1′).circleType({radius: [...]

2014年02月27日

Jquery中 mouseout 和 mouseleave 的区别

Filed under: 英语网站设计 — 标签： — lifengwu @ 12:51 上午

通过jQuery实现鼠标悬停效果时通常会用到mouseover和mouseout这对事件,那么当鼠标离开元素时所触发的mouseout与mouseleave的区别,表面上看这两者的意思是差不多，但实际上是有很大区别的。 mouseout() 方法 当鼠标指针从元素上移开时，发生 mouseout 事件。该事件大多数时候会与 mouseover 事件一起使用。 mouseleave() 方法 [...]

2013年12月30日

CSS实现自动适应宽度的半透明二级导航菜单

Filed under: 英语网站设计 — 标签：, , — lifengwu @ 10:21 上午

最近的一个网站应客户要求需要二级菜单，而且二级菜单的背景色还是半透明，我们都知道如果一个层设置为半透明，那么这个层里面的内容也会半透明，如果要想内容正常，又与二级菜单产生冲突！经过多次测试，总算找到了一个完美的解决方案！ 以下是最关键的CSS样式： white-space: nowrap; /*这个样式主要是让二级菜单的宽度根据宽度自适应*

2013年12月27日

使用jQuery Flat Shadow 插件轻松实现不错的长阴影效果

Filed under: 英语网站设计 — 标签：, — lifengwu @ 10:26 上午

通常情况下要实现文字的阴影效果，我们都知道需要在PS里面使用图层样式才可以实现，如果能直接在网页中实现这个效果，不仅省去了在PS中实现的麻烦，而且还可以为网站增色不少！ 下面我们就来看一下通过jQuery插件来轻松实现这个长阴影效果： 首先需要在网页中引入对应的jquery，这一步是必不可少的。 <script src=”http://code.jquery.com/jquery-1.9.1.js”></script><script src=”jquery.flatshadow.js”></script> 再有就是CSS样式问题： <style> html { [...]

2013年09月28日

Jquery+CSS 制作向下滑动的动画效果导航

Filed under: 英语网站设计 — 标签：, — lifengwu @ 1:47 下午

中文网站的建设过程中经常会涉及到Flash 的制作，因为网站有flash，看起来会更炫，但这同时也会造成网站的加载速度慢，造成体验效果不好，与之相对大多数的英语网站来说，最重要的就是要简洁明了，加载速度快，很少会有flash出现，但是看起来一样很舒服。不过通过Jquery没有flash,网站一样可以做出来不错的酷炫效果。实例： <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”> [...]

« Newer Posts