fid:https://jsfiddle.net/79un7vw5/1/
我想检查我的div的背景是否为红色,悬停时,向右移动。 否则,在悬停时将div移到左侧。
为什么不正确检查我的css属性?
let newView = UIView() newView.backgroundColor = UIColor.redColor()
newView.translatesAutoresizingMaskIntoConstraints = false view.addSubview(newView)
let pinTop = NSLayoutConstraint(item: newView, attribute: .Top, relatedBy: .Equal, toItem:
self.topLayoutGuide, attribute: .Bottom, multiplier: 1.0, constant: 0)
let heightConstraint = newView.heightAnchor.constraintEqualToAnchor(nil, constant: 50)
let widthConstraint = NSLayoutConstraint(item: newView, attribute: .Width, relatedBy: .Equal, toItem: view, attribute: .Width, multiplier: 1.0, constant: 0)
self.topContentAdditionalInset = 50
NSLayoutConstraint.activateConstraints([pinTop, heightConstraint, widthConstraint])
$(".div").hover(function(){
if( $(".div").css('background') == 'red'){
$(this).animate({right: '0px', backgroundColor:"rgb( 20, 20, 20 )"});
// will be called when the element finishes fading out
// if selector matches multiple elements it will be called once for each
}
else{
$(this).animate({left: '0px', backgroundColor:"rgb( 20, 20, 20 )"});
}
});
.div{
background:red;
height:100px;
width:100px;
position:absolute;
left:0;
}
.parent{
border:1px solid black;
width:500px;
height:100px;
position:relative;
}
答案 0 :(得分:0)
以下是您问题的小提琴:
http://jsfiddle.net/aw42aj2L/38/
这就是代码的样子:
$(document).on("mousemove", ".div", function(){
if( $(this).css('background-color') == 'rgb(255, 0, 0)'){
$(this).animate({right: '0px', "background-color":"rgb( 20, 20, 20 )"});
// will be called when the element finishes fading out
// if selector matches multiple elements it will be called once for each
}
else{
$(this).css({"background-color": "#FFFFFF"});
$(this).animate({left: '0px','background-color': "rgb(20,20,20)"}, 1200);
}
});
另外,请注意这里用于颜色动画的jquery UI。
<script type="text/javascript" src="http://code.jquery.com/ui/1.8.18/jquery-ui.min.js"></script>