简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Home> Web Front-end> JS Tutorial> body text

一个CSS+jQuery实现的放大缩小动画效果_jquery

WBOY
Release： 2016-05-16 16:59:23
Original
1263 people have browsed it

今天帮朋友写了一些代码,自己觉得写着写着，好几个版本以后，有点满意，于是就贴出来。

都是定死了的。因为需求就只有4个元素。如果是要用CSS的class来处理，那就需要用到CSS3动画了。

功能 : 在上方的按钮上滑动，可以切换各个page,点击下方的各个page，也可以切换收缩还是展开状态。
一个CSS+jQuery实现的放大缩小动画效果_jquery
初始效果预览

复制代码代码如下:




CSS+jQuery动画效果








page1

page2

page3

page4










Related labels：
enlarge zoom out
source：php.cn
Previous article：document.forms[].submit()使用介绍_javascript技巧 Next article：使用CSS样式position:fixed水平滚动的方法_jquery
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Latest Articles by Author
Latest Issues
Increase file upload size in Apache configuration Hello everyone! I'm struggling with this configuration issue because I'm trying to increas...
From 2023-11-11 11:00:33
0
1
287
Leverage VueJS components in PHP I want to mix basic HTML generated by Php and VueJS components without having to use VueJS...
From 2023-11-11 00:01:44
0
2
288
How to use open primitive tag in next js 13? In the recent NextJS13 update, they introduced a new way of handling meta tags that differ...
From 2023-11-10 23:03:51
0
1
527
Title rewritten to: Dynamic component import in Vite with React and typescript causing failure in fast refresh I'm trying to create a multi-step form and I'm putting the data in a separate file for con...
From 2023-11-10 20:45:29
0
1
505
Encountered error: A problem occurred while executing npm install && npm run dev - Vite - Laravel UI React Hi everyone, today I encountered a problem, when I installed laravelui using react and pas...
From 2023-11-10 17:43:07
0
1
278
Related Topics
More>
Popular Recommendations
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn：Public welfare online PHP training，Help PHP learners grow quickly！