仿京东BOE官网 jQuery代码
$(function() {
$("#chanping").mouseenter(function() {
$("#column").slideDown(500, function() {
$("#column").mouseenter(function() {
$("#column").show()
})
});
});
$("#column").mouseleave(function() {
$("#column").slideUp(500);
});
$("#chuanxing").mouseenter(function() {
$("#column2").slideDown(500);
});
$("#column").mouseleave(function() {
$("#column2").slideUp(500);
});
$("#scLeft").hover(function() {
$("#yishang1").animate({
width: "355px",
height: "245px",
})
},
function() {
$("#yishang1").animate({
width: "350px",
height: "240px",
})
});
$("#scCenter").hover(function() {
$("#yishang2").animate({
width: "355px",
height: "245px",
})
},
function() {
$("#yishang2").animate({
width: "350px",
height: "240px",
})
});
$("#scRinght").hover(function() {
$("#yishang3").animate({
width: "355px",
height: "245px",
})
},
function() {
$("#yishang3").animate({
width: "350px",
height: "240px",
})
});
$("#weixin2").hover(function() {
$("#wixin1").show();
$("#winxin3").attr('src', './images/weixin-icon01.png');
},
function() {
$("#wixin1").hide();
$("#winxin3").attr('src', './images/weixin-icon02.png');
})
$("#weibo2").hover(function() {
$("#wibo1").show();
$("#wibo3").attr('src', './images/weibo-icon01.png');
},
function() {
$("#wibo1").hide();
$("#wibo3").attr('src', './images/weibo-icon02.png');
})
$("#in2").hover(function() {
$("#in1").show();
$("#in3").attr('src', './images/yl.png');
},
function() {
$("#in1").hide();
$("#in3").attr('src', './images/yl2.png');
})
$('.a_1').mouseenter(function() {
$('.a_1').animate({
backgroundPositionY: -50,
})
}),
$(".a_1").mouseleave(function() {
$('.a_1').animate({
backgroundPositionY: 0,
})
})
$('.a_2').mouseenter(function() {
$('.a_2').animate({
backgroundPositionY: -190,
})
}),
$(".a_2").mouseleave(function() {
$('.a_2').animate({
backgroundPositionY: -130,
})
})
$('.a_3').mouseenter(function() {
$('.a_3').animate({
backgroundPositionY: -310,
})
}),
$(".a_3").mouseleave(function() {
$('.a_3').animate({
backgroundPositionY: -250,
})
})
$(".xianshi").mouseenter(function() {
$('#column_in1').show()
})
$(".xianshi").mouseleave(function() {
$('#column_in1').hide()
})
$(".chuangan").mouseenter(function() {
$('#column_in2').show()
})
$(".chuangan").mouseleave(function() {
$('#column_in2').hide()
})
$(".jiankang").mouseenter(function() {
$('#column_in3').show()
})
$(".jiankang").mouseleave(function() {
$('#column_in3').hide()
})
$(".fuwu").mouseenter(function() {
$('#column_in4').show()
})
$(".fuwu").mouseleave(function() {
$('#column_in4').hide()
})
});
仿京东BOE官网 jQuery代码的更多相关文章
- 仿京东BOE官网 html代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 仿京东BOE官网 JavaScript代码
let items = document.getElementsByClassName('item'); let points = document.getElementsByClassName('p ...
- 仿京东BOE官网 css代码
* { margin: 0; padding: 0; border: 0; list-style: none; } .box { width: 1518px; height: 1300px; marg ...
- 仿京东BOE官网图片链接
- 基于jQuery仿迅雷影音官网幻灯片特效
分享一款基于jQuery仿迅雷影音官网幻灯片特效迅.雷影音官网jQuery幻灯片特效是一款带左右箭头,索引按钮切换的jQuery幻灯片代码.效果图如下: 在线预览 源码下载 实现的代码. html ...
- android 官网处理图片 代码
/** * 获取压缩后的图片 (官网大图片加载对应代码) * * @param res * @param resId * @param reqWidth * 所需图片压缩尺寸最小宽度 * @param ...
- 官网jquery压缩版引用地址:
3.1.1版本 <!DOCTYPE html> <html lang="en"> <head> <meta charset="U ...
- 仿智能社官网：原生JS实现简单又酷炫的3D立方体时钟
先放一下我做的效果:https://linrunzheng.github.io/3Dclock/3Dclock/new.html 至于3D立方体怎么做这里就不在阐述了,可以看一下我之前的博客. 这里默 ...
- Bootstrap--模仿官网写一个页面
本文参考Bootstrap官方文档写了简单页面来熟悉Bootstrap的栅格系统.常用CSS样.Javascript插件和部分组件. 以下html代码可以直接复制本地运行: BootstrapPage ...
随机推荐
- C#怎么统计网站当前在线人数
1.问题背景 c#网站怎么合理的统计在线人数?我想通过全局变量来统计软件的使用情况,当启动软件时向服务器的用户表写开始使用时间,正常退出时写一个结束使用时间,来统计用户的在线使用情况. 但是有一个问题 ...
- Django学习路33_url 地址及删除元素 delete() 和重定向 return redirect('路径')
保存日期 def create(request): '''新增一本图书''' # 1.创建BookInfo对象 b = BookInfo() b.btitle = '流星蝴蝶剑' b.bpub_d ...
- Qt实现的多菜单选择界面
文章目录 1.效果展示 2.实现代码 2.1 菜单实现代码 2.1.1 头文件 2.1.2 源文件 2.2 应用代码 1.效果展示 这种菜单样式比较常用,实现的方法也有很多种,比如可以直接使用QTab ...
- Python编写的桌面图形界面程序实现更新检测和下载安装
在Python中我们有很多种方案来编写桌面图形用户界面程序,譬如内置的 Tkinter .强大的 PyQt5 和 PySide2 ,还有 wxPython .借助这些或内置或第三方的模块,我们可以轻松 ...
- 【av68676164（p38-p40)】进程调度
6.1 进程调度概念 进程调度 在合适的时候以一定策略选择一个就绪进程运行 进程调度的目标 响应速度尽可能快 进程处理的时间尽可能短 系统吞吐量尽可能大 资源利用率尽可能高 对所有进程要公平 避免饥饿 ...
- c++萌新到大牛，要看哪些书？
基础语法 <c++primer> 语法进阶 <c++primer plus> 专为c++编著.支持c++14国际标准. 数据结构和算法 <大话数据结构> 编程规范 ...
- Zookeeper学习（一）
一.Zookeeper理解与选举机制 ①Zookeeper理解 概念:Zookeeper 是一个开源的分布式协调服务框架 ,主要用来解决分布式集群中应用系统的一致性问题和数据管理问题 特点:Zooke ...
- JDBC的开发步骤
一.JDBC概述 JDBC(Java Data Base Connectivity,java数据库连接)是一种用于执行SQL语句的Java API,可以为多种关系数据库提供统一访问, 它由一组用Jav ...
- C#LeetCode刷题之#575-分糖果（Distribute Candies）
问题 该文章的最新版本已迁移至个人博客[比特飞],单击链接 https://www.byteflying.com/archives/3798 访问. 给定一个偶数长度的数组,其中不同的数字代表着不同种 ...
- Flutter build apk 如何访问网络
将下列配置放到路径:your_project\android\app\src下的 main 文件夹下的 AndroidManifest.xml 和 profile 文件夹下的 AndroidManif ...