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实现多行文本样式自定义
前几天一位在广告公司的朋友发来求助,说:“有一个项目要求实现对字符串进行动态拆分,然后对拆分出的字符分别使用不同的样式效果...”,听到这个需求,我内心有点不屑,这有何能,最多五分钟搞定啊~~ 于是我 ...
随机推荐
- 【javascript】上拉下拉弹窗实现
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- spring aop 切面编程
import java.io.IOException; import java.util.ArrayList; import java.util.Arrays; import java.util.Ha ...
- React Native之常用组件(View)
一. JSX和组件的概念 React的核心机制之一就是虚拟DOM:可以在内存中创建的虚拟DOM元素.React利用虚拟DOM来减少对实际DOM的操作从而提升性能.传统的创建方式是: 但这样的代码可读性 ...
- Git_GitHub-使用过程遇到的问题——坑(持续添加)
push错误——>master git push -u origin master 最后找到解决办法如下: 1.先删除远程 Git 仓库 $ git remote rm origin 2.再添加 ...
- spring-data-jpa中save不触发数据库insert语句的问题
最近学习spring mvc,用到jpa简化DAO层代码,发现save死活不触发SQL语句,找了好久才解决这个问题,实在是坑.. <!-- 关键是这个bean,一定要设置正确才行 --> ...
- MySQL:Download Connector/Python
MySQL Connector / Python是用于Python平台和开发的标准化数据库驱动程序. 此外,MySQL Connector / Python 8.0支持使用MySQL Server 8 ...
- xshell终端向远程服务器上传文件方法
centos-7下在本地终端里向远程服务器上传文件,在命令行中执行的软件. 安装命令如下: 在终端里输入如下命令: 会弹出如下窗口 选择你要上传的文件即可上传成功.
- 论文笔记:ATOM: Accurate Tracking by Overlap Maximization
ATOM: Accurate Tracking by Overlap Maximization 2019-03-12 23:48:42 Paper:https://arxiv.org/pdf/18 ...
- postgresql之json操作
--string 转 json select '{"Items":[{"Id":1,"InitStartDate":"2018-0 ...
- vue+vuex 回退定位到初始位置
先放出两张图(没错,你还在9012,做为一名资深设计师我唯一的技能点就是留白),简单说明下问题未做回退定位(从落地页回退,每次都回到A位置)想死啊有木有,每次都需要手动重新定位来选择,你大哥看到你做个 ...