Home > AI > Uncategorized

javascript 实现背景色渐变切换

用woocommerce搜索框时设想的,效果查看www.boygirl88.com

废话不说,放码过来!

<!-- Start search -->
	<div id="st-search" class="py-3">
		<div class="container">
			<div style="width:100%;text-align:center;">
				<?php get_product_search_form(); ?>
			</div>
		</div>
	</div>
	<style>
	#st-search{
		background-color:#ff6b47;
		transition:all 1s;
	}
	</style>
	<script>
	function changeSearchBg(){
		var s = document.getElementById('st-search');
		var colors = ["#ff8ca3", "#fede95",	"e0ffa4", "#3fbbff", "#ff6b47"];
		var rand = Math.floor(Math.random() * colors.length)
		s.style.background = colors[rand];
		s.style
	}
	window.setInterval('changeSearchBg()', 1000);
	</script>
	<!-- End search -->

 

Related posts:

Leave a Reply