當前位置:編程學習大全網 - 網站源碼 - html愛心特效代碼怎麽改花瓣的顏色

html愛心特效代碼怎麽改花瓣的顏色

html愛心特效代碼改花瓣顏色的方法如下:

1、獲取花瓣,所有調色條,以及用來顯示rgb值的div盒子。

2、給花瓣循環綁定點擊事件,這裏需要壹個匿名的自調用函數來儲存i的值,不然事件綁定不上,i值會變為最終長度值。

3、利用"排他思想"循環遍歷將所有花瓣的selected類名去掉,然後給當前點擊的花瓣添加被選中的類名"selected"將邊框變為虛線,表示被選中。

4、下面壹個for循環同樣利用了匿名的自調用函數存儲i值,然後給所有的調色條綁定input事件。

5、判斷壹下是否有被選中的元素,通過判斷之後獲取帶有selected類名的花瓣,然後將其背景顏色改為三個input輸入的value值,最後將三個rgb值渲染到顯示rgb值的div盒子中,這樣壹個彩色花瓣的效果就完成了。

  • 上一篇:Destoon源代碼安裝說明
  • 下一篇:請教壹下freertos的低功耗模式(tickless)的用法
  • copyright 2024編程學習大全網