[問題] 七點半的太空人動畫效果
第一次發文 排版不好真對不起
想要請問的是七點半的太空人 http://first-launch.com 這個網站
裡面小剪刀的動畫效果
用chrome F12後看到他在背景和文字的部分用了skrollr.js
這個部分有自己試過應該是沒有問題了
但是小剪刀類似逐隔動畫的效果怎麼樣也搞不懂
爬文有看到年初也有人問過相似的問題
自己研究後也認為它應該是把每格動畫都存在一張圖
利用background-position的改變來做成動畫效果
不過就像板上那篇文一樣 看不出來他是怎麼寫的
上網翻了很多網站後找到了這個 http://jsfiddle.net/cc5712/es5zW
但是它無法像七點半的太空人一樣往上滾的時候動畫會倒退
不管往上還是往下滾 動畫都是往前走不會後退(不知道這樣講是不是很難懂)
大概是scroll事件無法設定往上或往下吧?
後來又找到mousewheel.js來嘗試
可是做出來的成果變成只能用滑鼠滾輪控制
如果按網頁上的滾軸就毫無反應
想請問各位高手有沒有什麼方法可以做出用滾軸控制的動畫呢?
或是應該要去專研哪個部分
因為對網頁設計真的是菜鳥 只會初步的html css
最近有自己看一點javascript 和 JQuery這樣
希望各位願意幫忙 真的很謝謝!!
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 111.243.16.94
推
02/27 11:05, , 1F
02/27 11:05, 1F
→
02/27 11:07, , 2F
02/27 11:07, 2F
→
02/27 11:13, , 3F
02/27 11:13, 3F
→
02/27 11:13, , 4F
02/27 11:13, 4F
→
02/27 11:18, , 5F
02/27 11:18, 5F
→
02/27 19:42, , 6F
02/27 19:42, 6F
→
02/27 19:43, , 7F
02/27 19:43, 7F