goole动态图片导航

最新推荐文章于 2024-07-12 16:27:40 发布
最新推荐文章于 2024-07-12 16:27:40 发布
阅读量461 收藏
点赞数
分类专栏： IT 文章标签： class function javascript table html null

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=gb2312">
<title>google 动态图片导航的实现|www.tc-21.com</title>
<style type="text/css">
body {text-align:center}
table {border:1px solid #eeeeee;padding:3px 0;border-bottom-width:5px}
.icon td {width:50px;height:37px;background-image:url(/ITCenter/UploadFiles_2217/200908/20090806123036601.gif);cursor:pointer;}
.capt td {font:normal 11px verdana;padding:2px 0}
.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" type="text/javascript">
window.οnlοad=function(){
var tt=document.getElementsByTagName('table')[0];
var cs=tt.rows[1].cells,ct=tt.rows[0].cells;
for(var i=0;i<cs.length;i++)
    cssAni(cs[i],ct[i],7);
try
{
      document.execCommand("BackgroundImageCache",false,true)
}
catch(c)
{
}
}
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.οnmοuseοver=osrc.οnmοuseοut=otarget.οnmοuseοver=otarget.οnmοuseοut=function(e){
    n=r.test((e||event).type)?1:-1;
    if(!t) t=setInterval(function(){
      if (d!=n&&c!=1&&c!=num)
      {
        d=n;
      }
      if((c==1||c==num)&&((d==n||c+n<1)||!(d=n)))
          return clearInterval(t),t=null;
      otarget.className=s+(c+=d);
      //alert("i:"+i+" "+"s:"+s+" "+"c:"+c+" "+"d:"+d+" "+"n:"+n+" "+"r:"+r);
    },i);
};
}
</script>
</head>
<body>
<table>
<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='http://www.tc-21.com'>A</a></td>
    <td><a href='http://www.tc-21.com'>B</a></td>
    <td><a href='http://www.tc-21.com'>C</a></td>
    <td><a href='http://www.tc-21.com'>D</a></td>
    <td><a href='http://www.tc-21.com'>E</a></td>
    <td><a href='http://www.tc-21.com'>F</a></td>
    <td><a href='http://www.tc-21.com'>G</a></td>
</tr>
</table>
</body>
</html>
文章来自天诚世纪(www.tc-21.com) 详文参考：http://www.tc-21.com/ITCenter/200908/20090806122319.html

bin6120
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Android笔记：底部导航栏的动态替换方案
程龙的博客
12-15 4276
1、通常来说，一般情况下，我们的app的BottomTab会有下面几种实现方式。 自定义view，然后自己写逻辑去实现互斥。 使用RadioGroup+RadioButton去实现底部的Tab。 自由度比极高，如果想实现搞复杂度的话可以重写 RadioButton。 使用google design包里面的 TabLayout去实现。 可上、可下、可以滑动 偷懒的话可以根据已有api来设置一些...
Android google VR全景图导航
诗雨远方的博客
01-16 2383
Android google VR全景图导航       VR导航我们接入的是google vr的,其官方网站为https://github.com/googlevr/gvr-android-sdk,其VR素材地址为http://p0w477exg.bkt.clouddn.com/andes.jpg,下面看下集成的写法:一.所演示的样列为android studio新建一个空activity的只含...
css 动态导航栏
wcooper的博客
07-23 1970
css 动态导航栏上一周遇到几个小问题，其中一个是关于动态导航栏的问题，在这里写出来。动态导航栏的效果是，默认显示第一个li标签的下划线效果，然后点击其它li标签只显示当前自己li标签的下划线效果，看起来是很简单的一个问题，里面还是包含了不少细节。- 首先ul标签的子标签 li 的显示效果有如下几种none不使用项目符号 disc实心圆，默认值 circle空心圆 square实心方块
谷歌研究利用AI合成图片，使静态图片动起来
whale52hertz的博客
08-13 4840
内容来源：ATYUN AI平台 谷歌的研究人员开发了一个基于深度学习的系统，可以将立体相机，VR相机和双镜头相机（如iPhone 7或X）拍摄的静态图像转换为短视频。 “给出两个图像与已知的相机参数，我们的目标是让深层神经网络来推断适合于合成同一场景的视角，特别是在输入视图之外进行推断。”研究人员在研究中写道。 研究者使用NVIDIA的Tesla GPU的P100和cuDNN -acc...
使用Google云存储上传图片
warrior
09-27 4591
谷歌云存储官网：https://console.cloud.google.com/ 1.获取服务账号密钥：官网--左侧导航API和服务--凭据--创建服务账号密钥 2.将下载的Json文件配置到环境变量 A.Windows: set GOOGLE_APPLICATION_CREDENTIALS=path_to_service_account_file> set GOOGLE_APPL
GOOGLE首页导航栏动态图片实现效果
04-14
谷歌(GOOGLE)作为全球知名的搜索引擎，其首页的设计简洁而富有特色，尤其是导航栏的动态图片效果，更是给人留下深刻印象。本文将深入探讨如何实现类似谷歌首页导航栏的动态图片效果。 首先，动态图片的实现通常依赖...
仿google动态导航
11-12
【标题】"仿google动态导航"是一个利用JavaScript和CSS技术实现的网页交互效果，它巧妙地模拟了Google网站上的导航菜单动态展示的方式。这个项目展示了前端开发者如何通过这两种技术创造出富有动态感和视觉吸引力的...
Google首页的图片导航完整版
05-16
内容索引:脚本资源,Ajax/JavaScript,图片导航,菜单　从Google首页挖下来的图片导航，带资源文件完整版，相信大家都知道Google首页的导航吧，一排很炫的图片+文字组合而成的动画导航效果，开始还以为是一个Flash，...
Android底部导航栏的动态替换方案
08-26
动态替换底部导航栏的资源图片是 Android 应用程序中的一种常见需求。为了实现动态替换，需要使用 IntentService 下载资源压缩包。IntentService 是一个服务，只不过 Google 帮助我们在里面封装并维护了一个 ...
仿google首页下端图片文字导航
08-05
【标题】"仿google首页下端图片文字导航"是一个网页设计项目，旨在模仿谷歌首页底部的图片与文字相结合的导航栏。这个项目采用CSS（层叠样式表）和DIV（HTML文档中的布局容器）技术来实现，以创建出类似谷歌网站的...
更新商品前端接口编写
最新发布
weixin_55639995的博客
07-12 220
那么在vue运行的时候,会加载所有的ref属性特征的元素还有组件。标签中ref的作用就是将 该组件注册到vue对象的ref属性中。使用插槽,那个scope就是代表着一行的数据。然后里面的选项遍历的是 js定义的数据。如果文字显示过多可以使用 文本隐藏显示。表单绑定还有表单数据的绑定。数据绑定使用的表单绑定状态。写form表单然后封装数据。状态的选择使用的是选择框。副标题使用的是文本域。状态页面使用,下拉框。富文本选择器使用组件。使用后端枚举类型去写。
vue 自定义滚动条同步拖动（移动端）
u014206461的博客
07-12 98
vue 自定义滚动条同步拖动（移动端）
什么是防抖和节流？如何理解它们并在不同的场景条件下灵活运用？
Vinca@的博客
07-08 877
防抖（Debouncing）和节流（Throttling）是两种常见的性能优化技术，常用于控制某些操作（例如事件处理器）的频率，从而减少资源消耗并提高性能。防抖：在事件停止触发后的指定时间内执行函数。适用于需要等用户停止操作后再处理事件的场景。节流：在指定时间间隔内最多执行一次函数。适用于需要限制函数执行频率的场景。滚动停止后的操作：使用防抖。滚动过程中的持续操作：使用节流。根据具体需求选择适合的优化技术可以有效提高应用性能和用户体验。
Webkit简介以及工作流程
读心悦
07-10 305
WebKit是一个开源的浏览器引擎，最初由苹果公司基于KHTML（K Desktop Environment的HTML渲染引擎）开发，并广泛应用于Safari浏览器。随着时间的推移，WebKit也被其他多款浏览器和应用所采用，成为Web技术生态中的重要一员。WebKit的核心功能包括解析HTML、CSS、JavaScript等网页内容，并将其渲染为可视化的网页页面。它主要由WebCore（负责HTML解析、CSS样式计算和布局）和JavaScriptCore（负责JavaScript解释执行）两大部分组成。
lightchart 和百度echarts 有什么区别, 各自优势是什么
huanghm88的专栏
07-08 201
总体而言，Lightchart和百度Echarts都是强大的图表库，选择使用哪个取决于具体的需求和个人偏好。如果您对界面简洁和定制化有较高要求，可以选择Lightchart；社区活跃：百度Echarts拥有广泛的用户群体和开发者社区，用户可以通过社区获取到丰富的文档、教程和示例，解决问题和获取帮助。易于使用：Lightchart提供了方便易用的API和丰富的文档和示例，使用户能够快速上手并灵活使用图表库。成熟稳定：百度Echarts已经发布了多个版本，经过了长时间的发展和优化，具有较高的稳定性和可靠性。
vue引入sm-crypto通过sm4对文件进行加解密，用户输入密码
cc1314_工作、学习有感
07-12 89
通过sm4对文件进行加解密，用户输入密码
vue2 、 vue3首屏优化，减少白屏时间
m0_56104994的博客
07-09 304
vue2、vue3首屏优化,减少白屏时间
前端 JS 经典：迭代器
weixin_64684095的博客
07-12 153
如果在最后一个值返回后再调用 next()方法，那么返回的对象中属性 done 的值为 true，属性 value 则包含迭代器最终返回的值（如果没有相关数据则返回 undefined）。可迭代对象具有 Symbol.iterator 属性，通过指定的函数可以返回一个作用于附属对象的迭代器。JavaScript 中有一些内置的可迭代对象，如数组、字符串、集合（Set）、映射（Map）等，它们都具有默认的迭代器。在 JavaScript 中，迭代器是一个对象，它定义了一个序列，并在终止时可能返回一个返回值。
什么是vue的计算属性
weixin_56187723的博客
07-12 164
Vue的计算属性（Computed Properties）是Vue组件中的一个非常强大的功能，它们允许组件基于它们的响应式依赖进行缓存的派生值。只有当相关响应式依赖发生改变时，计算属性才会重新求值。这意味着只要依赖的响应式数据没有发生变化，多次访问计算属性会立即返回之前的计算结果，而不必再次执行计算函数。
android studio底部导航栏的图片被方块覆盖
05-21
这可能是因为您的图片尺寸过大或者布局设置有误导致的。您可以尝试以下方法： 1. 检查图片尺寸是否符合要求，通常建议使用24dp x 24dp的图片。 2. 确保您的布局设置正确，如下所示： ```xml <com.google.android.material.bottomnavigation.BottomNavigationView android:id="@+id/bottom_navigation" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" app:itemIconTint="@drawable/bottom_nav_color_selector" app:menu="@menu/bottom_navigation_menu" /> ``` 在这个布局中，`app:itemIconTint`属性设置的是图标的颜色选择器，您需要检查这个属性是否正确设置。 3. 如果您的图片尺寸和布局都没有问题，那么可能是您的图片资源出了问题。您可以尝试重新导入图片资源或者更换图片资源，然后再次运行您的应用程序。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值