啊等,你那邊還沒下雪啊,沒事,我們自己來下一場初雪吧。
下雪天.jpg
初冬.jpg
思(tao)路如下,雪天比較亮,比較灰,因為天空被雪籠罩。景物飽和度低,樹葉就算不落有薄雪覆蓋也不能太綠。
雪天色溫略偏冷。首先打開ps, 復制一下背景,把背景區域選出來,然后把背景飽和度都降低。
降低背景飽和,有雪葉子不會太綠的
然后把人物部分用蒙版擦回來。
加入雪花素材,圖層模式改為濾色(可以百度“下雪 素材”)
因為素材是純黑背景的所以用濾色模式,只顯示雪花
后面當然還可以添加逼真雪花,比如[sou 雪花畫筆]: http://brushes8.com/88406.html "雪花畫筆"
柔光模式
雪是立體的,離我們有遠有近,所以再來一層,同上。
改變點不透明度,用變亮或者柔光都可以
頭發和衣服有點青了,可以用小手直接在畫面拖動,改變飽和度,也可以把膚色加濃點。
最后我們加點S形曲線,就ok啦。
既然沒等到期盼已久的漫天大雪,就讓我們自己下場冬雪吧,會了么?
如果ps不熟,可以找影像君來學習啊,我們周五就開講咯 ↖(^ω^)↗。
天青色在等雪,等不到你,就自己下咯。
下是一個簡單的PHP下雪效果代碼示例:
```php
<!DOCTYPE html>
<html>
<head>
<title>下雪效果</title>
<style type="text/css">
body {
background-color: #333;
overflow: hidden;
}
.snowflake {
position: absolute;
top: 0;
left: 0;
width: 10px;
height: 10px;
background-color: white;
border-radius: 50%;
animation: fall linear infinite;
}
@keyframes fall {
from {top: -10px;}
to {top: 100%;}
}
</style>
</head>
<body>
<script type="text/javascript">
for (var i=0; i < 100; i++) {
(function(i) {
setTimeout(function() {
var snowflake=document.createElement('div');
snowflake.className='snowflake';
snowflake.style.left=Math.random() * window.innerWidth + 'px';
snowflake.style.animationDuration=Math.random() * 3 + 2 + 's';
document.body.appendChild(snowflake);
}, Math.random() * 2000 + 500);
})(i);
}
</script>
</body>
</html>
```
該代碼使用JavaScript創建了100個雪花元素,并使用CSS動畫實現了雪花下落的效果。您可以將代碼保存為一個HTML文件并在瀏覽器中打開,即可看到下雪的動畫效果。
天來了,雪是不是也來了呢?我是一名前端程序員,是時候展示真正的技術了,雪花飄落是不是大家心中的一把火呢?
最近瀏覽博客的時候看到一個這樣的案例,js實現雪花飄落效果。簡單的給大家介紹下:如何用javascript實現雪花飄落效果,并且可以讀取圖片的alt信息顯示出來。自個也復制了一份,送給頭條號上想操練自個水平的同學可以去操練下。
這篇文章共享之前我仍是要引薦下我自個的前端技術交流群:640633433,小編我都挺期待,不定期共享干貨,包含我自個整理的一份2018最新的前端材料和零根底入門教程,期待你的加入學習!
JavaScript實現雪花飄落效果展示圖圖:
我們繼續說實現雪花飄落的效果
主要是以下4步:
1、定義一片雪花模板;
2、設置第一個定時器,周期性定時器,每隔一段時間生成一片雪花;
3、設置第二個定時器,一次性定時器,當第一個定時器生成雪花,并在頁面上渲染出來后,修改雪花的樣式,讓雪花動起來;
4、設置第三個定時器,當雪花落下后,刪除雪花。
上面是實現的思路,下面寫出具體的代碼,下面的代碼是JS原生代碼,最后會附上JQuery實現的代碼,思路都一樣。
注意:
因為定時器添加的事件,會在下一次Event Loop執行,所以第二個定時器的作用是為了讓生成的雪花先拼接到頁面中渲染出來后,再修改他的樣式,這樣才能讓他動起來,如果沒有這個定時器,瀏覽器會把所有的JS代碼都執行完之后才渲染頁面,這樣的話后面的樣式就直接覆蓋前面的樣式了,雪花就沒法動了,這和瀏覽器的線程有關系。
簡單說,意思就是用了這個定時器,能把兩次修改樣式的代碼分開執行,可以先把第一次修改的樣式渲染后,在進行第二次的修改,雪花就會動了。
jQuery實現效果代碼:
冬天了,大家注意添加衣服哈,打雪仗記得多建幾個雪人,一年或者幾年才有一次,哈哈
最后在說幾句:
厲害程序員相對于普通程序員的優勢在于:
寫出的代碼更容易排錯,不是高手的代碼就不會錯,而是高手的代碼出了錯容易找。高手的代碼可讀性一定很好,模塊清晰,命名規范,格式工整,關鍵的地方有注釋,出了異常有log,自然容易排錯,即使交給別人去debug也是比較容易的。
這個特效項目到這里就算是做完了,想要完整代碼自己學習練手的小伙伴進我的群自助領取,已經上傳到群文件里了:640633433,里面也有更多好玩的前端項目,歡迎初學和進階中的小伙伴。
如果項目有哪些缺陷,歡迎在評論區指正!
如何還不夠火,大家可以在評論區寫幾句冬天里的一把火的歌詞
*請認真填寫需求信息,我們會在24小時內與您取得聯系。