css3手工计数器ui特效代码下载


css3手工计数器ui特效代码下载
css3手工计数器ui特效代码下载以及手工计数器ui等js/jquery网页特效代码下载。

1. 引入CSS

<link rel='stylesheet' href='https://fonts.googleapis.com/css2?family=B612+Mono&amp;display=swap'>
<link rel="stylesheet" href="css/style.css">

2. 引入JS

<script  src="js/script.js"></script>

3. HTML代码

<div id="rc1" class="counter">
	<div class="counter__body">
		<div class="counter__clip"></div>
		<div class="counter__clicker-hole">
			<button type="button" class="counter__clicker" data-inc="once">
				<span class="counter__sr">Increment</span>
			</button>
		</div>
		<div class="counter__digit-frame">
			<div class="counter__digit-window">
				<div class="counter__digit-reel">
					<div class="counter__digit">0</div>
					<div class="counter__digit">1</div>
					<div class="counter__digit">2</div>
					<div class="counter__digit">3</div>
					<div class="counter__digit">4</div>
					<div class="counter__digit">5</div>
					<div class="counter__digit">6</div>
					<div class="counter__digit">7</div>
					<div class="counter__digit">8</div>
					<div class="counter__digit">9</div>
					<div class="counter__digit">0</div>
				</div>
				<div class="counter__digit-reel">
					<div class="counter__digit">0</div>
					<div class="counter__digit">1</div>
					<div class="counter__digit">2</div>
					<div class="counter__digit">3</div>
					<div class="counter__digit">4</div>
					<div class="counter__digit">5</div>
					<div class="counter__digit">6</div>
					<div class="counter__digit">7</div>
					<div class="counter__digit">8</div>
					<div class="counter__digit">9</div>
					<div class="counter__digit">0</div>
				</div>
				<div class="counter__digit-reel">
					<div class="counter__digit">0</div>
					<div class="counter__digit">1</div>
					<div class="counter__digit">2</div>
					<div class="counter__digit">3</div>
					<div class="counter__digit">4</div>
					<div class="counter__digit">5</div>
					<div class="counter__digit">6</div>
					<div class="counter__digit">7</div>
					<div class="counter__digit">8</div>
					<div class="counter__digit">9</div>
					<div class="counter__digit">0</div>
				</div>
				<div class="counter__digit-reel">
					<div class="counter__digit">0</div>
					<div class="counter__digit">1</div>
					<div class="counter__digit">2</div>
					<div class="counter__digit">3</div>
					<div class="counter__digit">4</div>
					<div class="counter__digit">5</div>
					<div class="counter__digit">6</div>
					<div class="counter__digit">7</div>
					<div class="counter__digit">8</div>
					<div class="counter__digit">9</div>
					<div class="counter__digit">0</div>
				</div>
			</div>
		</div>
	</div>
	<button type="button" class="counter__knob" data-inc="all">
		<span class="counter__sr">Increment All</span>
	</button>
</div>

相关推荐

发表评论

相关文章