Jquery简单动画的实现记录
<div style="background:#98bf21;height:100px;width:100px;"> //从元素当前所在位置,往下消失
$(document).ready(function(){
$("button").click(function(){
$("div").css('position','absolute');
$("div").css('top',$("div").position().top);
$("div").animate({
top:'100%',
opacity:'0.5',
width:'150px',
height:'0px',
});
});
});
<textarea></textarea> //textarea选中时变高20px,离开时变回去
<script>
$(document).ready(function(){
$("textarea").focus(function(){
$("textarea").animate(
{height:'+=20px'}
);
});
$("textarea").blur(function(){
$("textarea").animate(
{height:'-=20px'}
);
});
});
</script>
Jquery简单动画的实现记录的更多相关文章
- jquery简单动画
自定义滑入滑出动画 <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Defaul ...
- jquery简单笔记(1) - 基础记录
一.dom对象及jquery对象相互转换 jquery对象转换成dom对象,即 [index] 和 get(index) 第一种方式: var $j = $('#id'); // jquery对象 v ...
- JQuery简单动画效果的发生顺序和animate方法
(1)在同一组元素上的效果 当在一个.animate()方法中以多个属性的方式应用时,是同时发生的. 当以方法连缀的形式应用时,是按顺序发生的(排队效果)---除非queue选项值为false. (2 ...
- jquery添加光棒效果的各种方式以及简单动画复杂动画
过滤器.绑定事件.动画 一.基本过滤器 语法 描述 返回值 :first 选取第一个元素 单个元素 :last 选取最后一个元素 单个元素 :not(selector) 选取去除所有与给定选择器匹 ...
- HTML5/jQuery雷达动画图表 图表配置十分简单
1.HTML5/jQuery雷达动画图表 图表配置十分简单 之前我们介绍过不少形形色色的HTML5图表了,像这款HTML5折线图表Aristochart是一款很不错的折线图表,这款HTML5 Canv ...
- JQuery 基本使用、操作样式、简单动画
JQ与JS JQ是JS写的插件库,就是一个JS文件 凡是用JQ能实现的,JS都能实现,JS能实现的,JQ不一定能实现 引入 BootCDN:https://www.bootcdn.cn/jquery/ ...
- jQuery中自定义简单动画的实现
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/stri ...
- jQuery的动画处理总结
最近一年多一直在做前端的东西,由于老板在追求一些年轻动感的效果,让页面元素不能仅仅是简单的隐藏显示,所以经常会使用一些动画效果,发现jQuery的动画真心好用啊,把常用的几个总结一下,希望不再每次使用 ...
- jQuery简单入门(三)
3.事件和动画 A. 事件 Aa. DOM加载 1.为什么使用jQuery加载DOM方法? 以javascript的window.onload()方法加载DOM的先决条件是:必须等待被请求页面的资源全 ...
随机推荐
- 引用(ajaxfileupload.js) ajaxfileupload.js报这错jQuery.handleError is not a function
jQuery.handleError is not a function 原因是,经测试handlerError只在jquery-1.4.2之前的版本中存在,jquery-1.6 和1.7中都没有这个 ...
- Linux SSH 互信
第一步: 创建用于身份认证的两个密钥文件 ssh-keygen #注明.想省事的话打完这个命令后一直回车就行了. 第二步: 把公钥上传到目标主机上去 ssh-copy-id -i id_rsa.pub ...
- C# 常用函数和方法集
1.DateTime 数字型 System.DateTime currentTime=new System.DateTime(); 1.1 取当前年月日时分秒 currentTime=System. ...
- delphi 实现vip126发邮件
本例是 TSimpleThread , TSimpleList, IdhttpEx 网页模拟(POST)的综合运用. Demo只写了发送,但亦可收取,详见源码. (此源码写于2年前,那时还写得不好,请 ...
- 读配置文件 properties
/** * */package com.sprucetec.tms.fee.utils;import java.io.IOException;import java.util.ArrayList;im ...
- css3 选择器的比较(一) -- 以字符串开头
一. 以“字符串”开头 两种用法的区别是: a. 以字符串开头,需要用"-"分割开, b. 以字符串开头,不需要任何分隔符 1. 资料 a) b) 2. html代码 < ...
- JavaSE思维导图(二)
- 全面修复IE,注册IE所有dll
全面修复IE,注册IE所有dll 复制,粘贴到文本文档里,保存成.bat文件,双击运行. rundll32.exe advpack.dll /DelNodeRunDLL32 %systemroot%\ ...
- 前端页面优化:javascript图片延迟加载
自己写了个简单的图片延迟加载小插件. 功能如下: 页面刷新,当前屏幕图片直接加载真实地址,body被卷去的部分和下方未显示的部分的img均加载通用图片如:loding.gif 随着屏幕上下滚动加载相应 ...
- php-fpm 开启错误日志
#php-fpm.conf #open catch_workers_output = yes #php.ini log_errors = On error_log=/data/logs/php-fpm ...