js给图层添加动态样式
需求:需要在视窗内随意点击对应位置,图层从上到下匀速运动到指定位置

html
<img id="moveDot" class="moveDot" src="data:images/moveDot.png">
js
//地图插点动态效果
//横坐标
var x=120;
//纵坐标
var y=200;
var style = document.styleSheets[0];
style.insertRule('.moveDot {width:30px;height:auto;position:absolute;left:'+x +'px;top:'+y +'px;z-index:999999;animation:mymove 500ms;-webkit-animation:mymove 500ms;animation-timing-function:linear;}', 0);
style.insertRule('@keyframes mymove{from{ top:0; }to{top:'+y +'px;}}',0);
style.insertRule('@-webkit-keyframes mymove{from{ top:0; }to{top:'+y +'px;}}',0);
js给图层添加动态样式的更多相关文章
- js 左侧树添加选择样式
选择样式添加 menuToggle: function() { var menus = $('.nav-primary').children('li'); var tog = menus.has('. ...
- 为不同分辨率单独做样式文件,在页面头部用js判断分辨率后动态加载定义好的样式文件
为不同分辨率单独做样式文件,在页面头部用js判断分辨率后动态加载定义好的样式文件.样式文件命名格式如:forms[_屏幕宽度].css,样式文件中只需重新定义文本框和下拉框的宽度即可. 在包含的头文件 ...
- 动态为页面添加CSS样式文件引用
动态为页面添加CSS样式文件引用: if (document.createStyleSheet) { //IE document.createStyleSheet("./Themes/Def ...
- 微信小程序--动态添加class样式
尺寸单位: rpx(responsive pixel): 可以根据屏幕宽度进行自适应.规定屏幕宽为750rpx.如在 iPhone6 上,屏幕宽度为375px,共有750个物理像素,则750rpx = ...
- 【转】ArcGIS Server 10.1 动态图层—添加栅格
本文将介绍如何通过arcgisserver10.1动态图层添加栅格影像.与添加矢量数据不同的是,天际栅格用到了RasterDataSource接口,如下所示 <esri:DynamicLayer ...
- 044. asp.net主题之二为主题添加CSS样式和动态加载主题
1. 新建任意一个网站, 默认主页为Default.aspx, 增加一个App_Themes目录, 用于存储主题, 添加一个MyTheme的主题, 在MyTheme主题下添加一个样式表文件, 默认名称 ...
- DOM动态脚本和动态样式
动态脚本 [定义] 在页面加载时不存在,但将来的某一时刻通过修改DOM动态添加的脚本. [方式] [1]插入外部文件方式 var script = document.createElement(&qu ...
- Less (一种动态样式语言)
Less (一种动态样式语言). LESS是一种由Alexis Sellier设计的动态层叠样式表语言,受Sass所影响,同时也影响了 Sass的新语法:SCSS. LESS是开源的,其第一个版本由R ...
- 使用JQuery.lettering.js实现多行文本样式自定义
前几天一位在广告公司的朋友发来求助,说:“有一个项目要求实现对字符串进行动态拆分,然后对拆分出的字符分别使用不同的样式效果...”,听到这个需求,我内心有点不屑,这有何能,最多五分钟搞定啊~~ 于是我 ...
随机推荐
- ceph添加osd(ceph-deploy)
修改主机名和 /etc/hosts 关闭防火墙和 SELINUX 安装和配置 NTP ceph-deploy 节点安装 安装 ceph-deploy sudo yum install ceph-dep ...
- vue-loader的理解
1.vue-loader是webpack的加载器,允许以单文件组件(SFC)的格式创作Vue组件 2.允许对Vue组件的每个部分使用其他webpack加载器 3.允许.vue文件中的自定义块可以应用自 ...
- java0424 wen 集合框架2
- 直方图均衡化与Matlab代码实现
昨天说了,今天要好好的来解释说明一下直方图均衡化.并且通过不调用histeq函数来实现直方图的均衡化. 一.直方图均衡化概述 直方图均衡化(Histogram Equalization) 又称直方图平 ...
- 【Django基本命令002】
在mac或者window的终端直接输入这些命令(不是Python的shell中) 一.创建Django项目之前必须先激活 具体方法可以参考Python机器语言学习博客 二.开始新建项目 1.新建一个d ...
- analysed of J-SON/XML processing model Extend to java design model (J-SON/XML处理模型分析 扩展到Java设计模型 )
一.JSON和XML 1.JSON JSON(JavaScript Object Notation)一种轻量级的数据交换格式,具有良好的可读和便于快速编写的特性.可在不同平台之间进行数据交换.JSON ...
- Linux 文件内容查看(cat、tac、nl 、more 、less、head、tail )
Linux系统中使用以下命令来查看文件的内容: cat: 由第一行开始显示文件内容tac :从最后一行开始显示,可以看出 tac 是 cat 的倒著写!nl: 显示的时候,顺道输出行号!more ...
- Redhat乱码
1 首先可以使用echo $LANG命令输出当前字符集. 2 我们需要把字符集改为zh_CN.UTF-8,在/etc/sysconfig/i18n文件中进行修改 3 使用source /etc/sy ...
- python实现列表去重的方法
>>> l=[,,,,,,] >>> list(set(l)) [, , , ] >>>
- react项目中实现悬浮(hover)在按钮上时在旁边显示提示
<i className={classNames({ 'device-icon': true, 'camera-icon': true, 'camera-icon-hover-show-intr ...