ECShop 网上商店系统支持论坛's Archiver

dasiji 发表于 2007-11-21 09:09

ec用户有福了“Google韩国首页“前卫”改版 添加新导航图标”提供下载

  Google韩国首页近日进行了颇为“前卫”的改进,让用户眼前一亮。
  Google韩国的新首页放弃了Google一贯的极简风格,不仅添加了花哨可爱的新导航图标,还有颇具人情味的动画效果,只要你的鼠标放在图标上,便会自动展示一个小会话框解释这一服务的用途。
  与Google韩国相比,谷歌的界面就显得过于保守,也许欧美人偏爱简洁,但是对于并不了解各种Google服务的绝大多数中国用户来说,一个小小的亲切的讲解框比长篇的教程更容易打动普通用户。

[attach]5242[/attach]

[b][size=4][color=darkred]韩国首页演示地址:[/color][/size][/b][url=http://www.google.co.kr/][b][size=4][color=darkred]http://www.google.co.kr/[/color][/size][/b][/url]
[b][size=4][color=darkred]中国首页演示地址:[/color][/size][/b][url=http://www.baizoo.cn/google/][b][size=4][color=darkred]http://www.baizoo.cn/google/[/color][/size][/b][/url]
[b][size=4][color=darkred][/color][/size][/b]
[url=http://download.makewing.com/lanren/menu/google_kr.rar][b][size=4][color=darkred]韩国版本的源码下载[/color][/size][/b][/url]

这是国内一个人自己做的一个研究文章,有源码的
[url=http://www.nijj.cn/blog/article.asp?id=41]http://www.nijj.cn/blog/article.asp?id=41[/url]

[[i] 本帖最后由 dasiji 于 2007-11-21 09:15 编辑 [/i]]

QingHou 发表于 2007-11-21 09:12

这算入乡随俗吧..

dasiji 发表于 2007-11-21 09:18

javascript仿韩国Google效果需要的图片:
[img=372,259]http://www.sosuo8.com/article/upimages3/svc_sprite_all.gif[/img]
这是找到的国内另外一个更简洁的代码示例代码:
[url=http://www.sosuo8.com/article/show.asp?id=1485][size=5][color=red]演示网址[/color][/size][/url]
[quote]

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<HTML><HEAD><TITLE>SooJs_仿韩国Google效果</TITLE>
<META http-equiv=Content-Type content=text/html;charset=gb2312>
<STYLE type=text/css>BODY {
        TEXT-ALIGN: center
}
TABLE {
        BORDER-RIGHT: #eeeeee 1px solid; PADDING-RIGHT: 0px; BORDER-TOP: #eeeeee 1px solid; PADDING-LEFT: 0px; PADDING-BOTTOM: 3px; BORDER-LEFT: #eeeeee 1px solid; PADDING-TOP: 3px; BORDER-BOTTOM: #eeeeee 5px solid
}
.icon TD {
        BACKGROUND-IMAGE: url(/article/upimages3/svc_sprite_all.gif); WIDTH: 50px; HEIGHT: 37px
}
.capt TD {
        PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 2px; FONT: 11px verdana; PADDING-TOP: 2px
}
.a {
        BACKGROUND-POSITION-Y: 0px
}
.b {
        BACKGROUND-POSITION-Y: -37px
}
.c {
        BACKGROUND-POSITION-Y: -74px
}
.d {
        BACKGROUND-POSITION-Y: -111px
}
.e {
        BACKGROUND-POSITION-Y: -148px
}
.f {
        BACKGROUND-POSITION-Y: -185px
}
.g {
        BACKGROUND-POSITION-Y: -222px
}
.f1 {
        BACKGROUND-POSITION-X: 0px
}
.f2 {
        BACKGROUND-POSITION-X: -51px
}
.f3 {
        BACKGROUND-POSITION-X: -101px
}
.f4 {
        BACKGROUND-POSITION-X: -153px
}
.f5 {
        BACKGROUND-POSITION-X: -205px
}
.f6 {
        BACKGROUND-POSITION-X: -257px
}
.f7 {
        BACKGROUND-POSITION-X: -309px
}
</STYLE>

<SCRIPT language=javascript>
window.onload=function(){
  var t=document.getElementsByTagName('table')[0];
  var cs=t.rows[1].cells,ct=t.rows[0].cells;
  for(var i=0;i<cs.length;i++)
    cssAni(cs[i],ct[i],7);
}
function cssAni(osrc,otarget,num,duration){
  var t=null,c=1,d=0,n=0,i=Math.floor((duration||300)/num);
  var s=otarget.className.replace(/.$/,''),r=/over/;
  osrc.onmouseover=osrc.onmouseout=function(e){
    n=r.test((e||event).type)?1:-1;
    if(!t) t=setInterval(function(){
      if((c==1||c==num)&&((d==n||c+n<1)||!(d=n)))
          return clearInterval(t),t=null;
      otarget.className=s+(c+=d);
    },i);
  };
}
</SCRIPT>

<META c name=GENERATOR></HEAD>
<BODY>
<TABLE>
  <TBODY>
  <TR class=icon>
    <TD class="a f1"></TD>
    <TD class="b f1"></TD>
    <TD class="c f1"></TD>
    <TD class="d f1"></TD>
    <TD class="e f1"></TD>
    <TD class="f f1"></TD>
    <TD class="g f1"></TD></TR>
  <TR class=capt>
    <TD><A
    href="javascript:void(null)">A</A></TD>
    <TD><A
    href="javascript:void(null)">B</A></TD>
    <TD><A
    href="javascript:void(null)">C</A></TD>
    <TD><A
    href="javascript:void(null)">D</A></TD>
    <TD><A
    href="javascript:void(null)">E</A></TD>
    <TD><A
    href="javascript:void(null)">F</A></TD>
    <TD><A
    href="javascript:void(null)">G</A></TD></TR></TBODY></TABLE>
</BODY></HTML>

[/quote][/i][/i]

[[i] 本帖最后由 dasiji 于 2007-11-21 09:27 编辑 [/i]]

konloned 发表于 2007-11-21 09:25

"ec用户有福了"
这和EC用户有什么关系???

eccom 发表于 2007-11-22 00:27

回复 #1 dasiji 的帖子

写那么多的代码不累吗?
用 Flash 一样能做出这个效果,而且还简单得多。
学以致用~~举一反三才是上上策!

dasiji 发表于 2007-11-22 11:37

楼上的,也有道理

mienflying 发表于 2007-11-26 18:41

广告一个!

不过可以提示一下,它主要是用来CSS Sprit技术!

小杜 发表于 2007-11-28 17:00

哎.../////

慧革尔.科技 发表于 2008-6-18 17:59

*** 作者被禁止或删除 内容自动屏蔽 ***

bigmonkgo 发表于 2008-6-19 11:24

有点意思

*** 作者被禁止或删除 内容自动屏蔽 ***

mike247 发表于 2008-6-23 15:18

谢谢楼主啊~~

页: [1]

Powered by Discuz! Archiver 6.1.0  © 2001-2007 Comsenz Inc.