仿京东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 ...
随机推荐
- HttpServletRequest、HttpServletResponse
doGet()/doPost()方法都有两个参数,一个为代表请求的request,另一个代表响应response. request是获取前台传递的内容,response是反馈给前台数据 HttpSer ...
- REST是什么？RESTFul又是什么？这二者的关系是怎样的？
REST(一种软件架构风格) 全称:Representational State Transfer 含义:(表述性 状态 转移) 是一种针对网络应用的设计和开发方式,可以降低开发的复杂性,提高系统的可 ...
- IDEA去掉Autowired的黄色背景和对象的红线
Intellij idea @AutoWired注入bean 出现红色波浪线,@autowird下面显示黄色波浪线或者标黄,如下图,解决方法总结一下供大家使用 首先选择File--Settings- ...
- matpltlib 示例
matplotlib https://matplotlib.org/index.html
- PHP array_udiff_assoc() 函数
实例 比较两个数组的键名和键值(使用内建函数比较键名,使用用户自定义函数比较键值),并返回差集: <?phpfunction myfunction($a,$b){if ($a===$b){ret ...
- PDO::lastInsertId
PDO::lastInsertId — 返回最后插入行的ID或序列值(PHP 5 >= 5.1.0, PECL pdo >= 0.1.0) 说明 语法 string PDO::lastIn ...
- 【NOI2005】聪聪与可可 题解（最短路+期望DP）
前言:学长讲的太神了:自己还能推出来DP式子,挺开心. -------------------------- 题目链接 题目大意:给定一张含有$n$个结点$m$条边的无向连通图.现在聪聪在点$s$,可 ...
- 【FZYZOJ】无向图的联通图个数 题解（组合数学）
题目大意:求无向图的连通图个数.由于个数可能很大,只需要求出结果$mod1000000009$的值.$n\leq 1000$ ------------------------- 对于一个含有$n$个结 ...
- 028_go语言中的超时处理
代码演示 package main import "fmt" import "time" func main() { c1 := make(chan strin ...
- Python 超简单 提取音乐高潮(附批量提取)
很多时候我们想提取某首歌的副歌部分(俗称 高潮部分),只能手动直接卡点剪切,但是对于大批量的获取就很头疼,如何解决? 很多人学习python,不知道从何学起.很多人学习python,掌握了基本语法过后 ...