重置Jquery颜色选择器输出样式

时间:2015-02-25 18:13:56

标签: jquery colors reset picker

如何为删除/重置添加重置按钮?当我点击一个颜色,添加背景样式到.class-bg,我想用重置按钮重置/删除这个样式?



$(document).ready(function () {
    var colors = ['feff35','fff600','ffe800','d0eb2c','aed14f','40aa48','71cde3'];
	

	$ClassBg = $('.color-class-bg'), $stageClassBg = $('.class-bg'),
    $.each(colors, function (i, color) { $ClassBg.append('<div class="color-square" style="background:#' + color + ';"></div>'); });
    $ClassBg.on('click', '.color-square', function (event) { $stageClassBg.css('background', $(this).css('backgroundColor')); });

	
});
&#13;
.color-square{display:inline-block;width:28.75px;height:28.75px;margin: 0 0 -3px 0;cursor:pointer;text-align:center;transition: .1s ease;}
.color-square:hover{box-shadow:0 5px 20px rgba(0, 0, 0, 0.8);transform: translateY(0px) scale(1.70);}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<p class="color-class-bg"></p>
<p class="class-bg">CONTENT</p>
<a href="#" class="reset">reset style</a>
&#13;
&#13;
&#13;

0 个答案:

没有答案