首页风格
门户
博客

GBin1博客视图 - 最近发布的文章-demo

分享7个最新的使用jQuery及其CSS实现的悬浮特效

日期:2011/12/12  来源:GBin1.com

分享7个最新的使用jQuery及其CSS实现的悬浮特效www.gbin1.com

鼠标悬浮特效是网页制作的常用特效之一,最早使用flash可以创新的制作非常炫的效果,现在我们同样也可以使用CSS和Javascript来实现。

今天的这个文章中,我们将推荐一些非常不错的特效教程,希望对大家有些帮助!

Hover and Click Trigger for Circular Elements with jQuery

这个教程将介绍如何使用jQuery来处理一个真正的圆形元素的悬浮效果,因为我们使用:hover实现的悬浮,其实别不针对圆形元素本身。

中文教程参考:分享一个使用jQuery开发的圆形页面元素悬浮和点击触发教程

分享7个最新的使用jQuery及其CSS实现的悬浮特效 gbin1.com

Original Hover Effects with CSS3

使用jQuery实现的10个不同的悬浮效果展示,帮助你构建超酷的悬浮效果。

中文教程参考:分享jQuery实现的超酷悬浮覆盖式的注释效果

分享7个最新的使用jQuery及其CSS实现的悬浮特效 gbin1.com

Fancy Image Hover…

标签: 悬浮, 悬浮效果, CSS悬浮, javascript悬浮, jquery悬浮效果, jquery hover, css hover, GBin1

阅读更多

分享几个超酷的jQuery插件帮助你快速实现页面无限滚动功能

日期:2011/12/02  来源:GBin1.com

无线滚动功能在现在的网站应用上非常广泛,它能够帮助你有效的提高用户的使用体验,使用无限滚动特性,用户无须点击下一页或者上一页就可以查看分页的数据,如果你没有尝试过无线滚动的功能,推荐你使用本站的站内搜索,查询结果的显示就是一个典型的无限滚动的例子。如果你想自己编写JS实现无限滚动,可能稍微有些麻烦,而使用jQuery的插件,实现无线滚动将会是一个非常轻松快乐的事情。那么今天我们将带给大家5个非常不错的jQuery插件来帮助大家实现无限滚动的功能。

使用无限滚动的优缺点:

优点:

  • 用户在网站的时间会更长,用户不会喜欢持续的点击下一个页面
  • 符合用户的阅读习惯
  • 无需指导就可以使用这个功能

缺点:

  • 页脚可能这辈子也到不了
  • 无法取消这个功能
  • 对于指定页面可能没有固定的链接
  • 动态加载内容到页面会增加浏览器的内存访问

1. Infinite Scroll (无限滚动插件)…

标签: 无限滚动, 无限滚动应用, jQuery无限滚动, javascript无限滚动, Ajax滚动加载, Ajax应用, GBin1

阅读更多

[jQuery代码]jQuery中如何使用document ready?

日期:2011/11/28  来源:GBin1.com

很多人都使用jQuery的document ready方法,但是不是所有人都理解如何使用jQuery。

使用方式1

$(document).ready(function() {
    //当DOM完成后执行代码
});

使用方式2

$(function(){
    //jQuery 相关代码
});

和第一个种方式一样,语法上和第一钟方式没有区别

使用方式3

jQuery(document).ready(function($) {
    //当DOM完成后执行代码
});

$符合和以上代码中的jQuery意义一样,这样使用可以避免不同类库的冲突。

因为目前的各种流行的类库中都使用$来作为缩略符号,这样造成浏览器无法解析。

我们可以使用完整的jQuery来避免混淆,然后调用$.noConflict()方法

jQuery.noConflict();…

标签: jQuery代码, jQuery代码大全, noConflict, document.ready(), jQuery ready(), GBin1

阅读更多

jQuery的平滑页面内锚定链接插件:$.smoothAnchor()

日期:2011/11/23  来源:GBin1.com

jQuery的平滑页面内锚定插件提供给你一个轻量级的脚本帮助你添加页面内的锚定帮助你平滑的滚动页面。当然这里有其它的类似插件,不过这个是比较轻量级的版本。只有2kb,希望大家喜欢!

在线演示

jQuery代码

var JQUERY4U = {}
JQUERY4U.UTIL = {
/*
* Utility function used to make anchor links animate smoothly instead of jumping.
*/
smoothAnchor: function (anchorClass)
{

标签: 页内锚定, anchor link, 页内导航, 页内平滑导航, jQuery页内平滑导航, jQuery页内导航插件, GBin1

阅读更多

如何使用javascript得到鼠标的位置?

日期:2011/11/22  来源:GBin1.com

javascript开发中有时候需要获取当前的鼠标位置,下面俩段代码,都可以帮助大家实现以上需求。

使用jQuery

在线演示1

jQuery(document).ready(function(){
   $(document).mousemove(function(e){
      $('#status').html(e.pageX +', '+ e.pageY);
   }); 
})

使用Javascript

在线演2 

// Detect if the browser is IE or not.
// If it is not IE, we assume that the browser is NS.
var IE = document.all?true:false

// If NS -- that is, !IE -- then set up for mouse capture
if (!IE) document.captureEvents(Event.MOUSEMOVE)

//…

标签: javascript mouse, mouse position, 鼠标位置, 得到鼠标位置, 如何得到鼠标位置, GBin1

阅读更多

图文并茂教你如何托收和兑现Google adsense支票

日期:2011/11/18  来源:GBin1.com

通常在Google正式给你发送美元支票前,当你的美元账户到达10美元的时候会给你邮寄PIN码,用来确认你的邮件地址是否正确,而且在你确认PIN码前,你无法修改账户相关信息。以下是PIN码邮件信封:

图文并茂教你如何托收和兑现Google adsense支票, google adsense PIN码

当你输入PIN码验证后,你就可以设置你的支付方式了。

等到你的美金账户到达100美元后,Google就给你邮寄支票了,这个过程大概需要15-30天。 我这里大概花了2周时间收到支票。支票信封如下:

图文并茂教你如何托收和兑现Google adsense支票 - 支票信封

以下是汇丰给寄的支票

图文并茂教你如何托收和兑现Google adsense支票

上面有你的名字和支票数额。你收到这个邮件后,请带上你的有效证件,例如,身份证,去最近的中国银行办理托收手续。

中国银行需要收支票数额0.1%的手续费,最低50元,最高250元,外加10元的邮寄费用,并且提供一张你个人的银行账户或者卡。 全部办完后,将给你光票托收申请书。45天后,你可以拿着这个托收申请书去银行确认支付。当然,如果你的账户有到账提醒短信,会自动提醒你,没有开通可以开通2元一月,头半年免费。

以下是光票托收申请书:

图文并茂教你如何托收和兑现Google adsense支票

标签: google adsene PIN, google adsense支票, google adsense支票兑现, google adsense支票托收, google adsense支取收入, google adsense兑现收入, GBin1, Google支票

阅读更多

使用HTML5,CSS3和jQuery来增强网站的用户体验和使用乐趣

日期:2011/11/16  来源:GBin1.com

记得几年前如果你需要添加一些互动元素到你的网站中用来改善用户体验? 是不是立刻就想到了flash实现?这彷佛年代久远的事了。使用现在最流行的web技术 HTML5,CSS3和jQuery,同样也可以实现类似的用户体验。而且使用这些特性将会比使用flash更加有效。也许你可能刚知道Adobe停止开发移动版flash的消息,虽然在桌面中我们还拥有大量的flash的应用,但是随着HTML标准的完善,可能flash也要退出历史舞台了。在今天这篇文章中,我们 将介绍一些非常实用的教程,技巧和资源来帮助大家构建一个更加丰富的用户界面。请大家给积极我们留言!您的支持是我们的最好的动力!

使用HTML5,CSS3和jQuery来增强网站的用户体验和使用乐趣

表单类

jQuery的美化Checkbox

这个教程将帮助你构建一个非常动感的checkbox,用来替换缺省的checkbox,相信大家会喜欢更富有活力的UI界面

使用HTML5,CSS3和jQuery来增强网站的用户体验和使用乐趣

Rethinking…

标签: HTML, HTML5, CSS, CSS3, Javascript, JQuery, 用户界面, UI, 用户体验, 提高用户体验, GBin1

阅读更多

SEO意识的网站设计:设计和SEO的完美结合可能么?

日期:2011/11/10  来源:GBin1.com

介绍

约束和创新是一对天生的冤家,为了更好的提升其中一个方面你不得不需要牺牲另外一个方面。同样的原因造成了设计者仍然在黑暗中摸索如果有效的结合SEO和设计理念。SEO往往遵循着特定的原则,但是伟大的设计往往超越了传统,可能带来了互相冲突的地方。但是我们都知道,一个好的设计应该是没有意义的,除非它能得到在线的关注。因此,我们将开辟一个前人没有尝试过的方式,来处理这些令人沮丧的麻烦。下面的这些步骤能帮助你使得"具有SEO意识的网站设计"更加的具体和明了。

SEO意识的网站设计:设计和SEO的完美结合可能么?

敏感性实验

我研究过不同的网站发现虽然他们看起来非常的炫酷但是对于初次访问的用户来说几乎没有什么易用性可言。最好的方式来验证是否你在你的实验中过度尝试的方法就是邀请你的奶奶来看看你的设计。如果她说,她明白整个布局并且能够在布局中自由的导航。那么你可以放心你的设计。然而,事实上往往正相反,这个时候你应该重新审阅你的设计,并且减少复杂度,帮助初次访问你的用户更好的体验网站。这个过程会帮助你更加你的网页浏览时间,并且能帮助你更好的更加你的网站的可见性。

不要添加任何大图片

设计者们往往有添加超大图片的习惯,这往往会毁坏整个网站的可见性。因此,如果你计划设计个超大的作品,记住不要让图片占用太多的网页模板。…

标签: SEO, SEO网站设计, GBin1, SEO和设计结合

阅读更多

拒绝用SEO的眼光来设计你的Meta标签

原文:webdeveloperjuice.com            编译:GBin1.com

当我们谈起keywords和description标签,很多人都会想到SEO优化,人们往往认为更贴合的关键字会带来更多的"金子"。 但是事实上,其实不是如此。

Google并不是很在意meta标题和description标签。当然Google会查看并且通过这个方式你可以告诉搜索引擎大概这个页面有些什么内容,但是现在并不像过去那么重要了。就像keyword标签现在几乎已经被忽略了。Google知道哪些小广告伎俩。但是现在没有什么关系因为他们有更多重要作用。

书写非常好的Meta标签

当你书写你的meta标签时,尽量不要去考虑搜索引擎。最重要的是考虑你的用户如何使用搜索引擎来查询内容的。想想最后一次你是如何搜索新的内容。很可能的情况是你输入了关键字,然后滚动搜索页面知道找到符合你需求的内容。

这就是你需要书写的Meta标签内容。只要你书写的内容对于Google来说是有效的,它就会将你的页面内容显示在搜索结果页面中。…

标签: GBin1, SEO, SEO优化, Meta标签, 设计Keyword, 设计description, Meta标签设计

阅读更多

喜欢我们的文章请您与朋友分享:

?ü?à

今日推荐