前端的CSS JS问题

前端学习心得：

  因为前端不够熟练，做起来比较慢，关于图片点击切换和鼠标切换问题。这两件事件做了一天多。

1、首先是图片问题，点击切换事件需要用jquery来做，变量定位到图片位置的标签，使用attr定位到图片的src属性，然后更换图片：

$('#img-1').attr("src", "Act/20171220/egg2.png")

2、其次是鼠标的图片问题，首先使用CSS的cursor属性即可变换鼠标图案。如：

cursor: url('Act/20171220/8.png'), crosshair;

3、再次是点击使鼠标图案切换，使用JS定位到点击的位置的图片，

var on = document.getElementById('img-1');

on.onmousedown = function() {

$(this).css({"cursor":"url('Act/20171220/9.png'),auto"});

on.οnmοusemοve=function(){

$(this).css({"cursor":"url('Act/20171220/8.png'),auto"});}}

4、让图片居中问题，使用块元素水平居中前需要

left: 0;

right: 0;

margin: 0 auto;

5、关于动画的问题css3中定义了新的动画

-webkit-animation:mymove 2s infinite; 定义动画

-webkit-animation-iteration-count:1; 定义次数

@-webkit-keyframes mymove {               运动轨迹

from {top:520px;}

to {top: 430;}}

6、文字发光text-shadow: 3px 3px 1px rgb(225, 254, 255)