特に用意された機能ではないようだが。力技で分割してると思う。具体的には必要分の長方形を作って、それぞれの長方形に元画像をコピーしてマスクしてズラせばいい。Nivo Sliider っていうのが似たような事をする。https://github.com/Codeinwp/Nivo-Slider-jQuery
これJSだけで実装できなかったっけ?こんな感じのチュートリアル見たことあるぞ。Webgl使うならシェーダー自前で書ける人なら実装できそう。pixi.jsは知らんけど。
このサイト、写真もテキストもボタンも全部一枚のcanvas上に描画してるんだなマウスイベントなんかもJSで座標管理してやってるんだと思う普通のスライダーのトランジションとは違うね
Re:4 はい、pixi.jsの公式サイトに乗っていた事例サイトでした。そのため、コードがよめないんです;
Re:5 おそらくですが、As3でいうBitmapDataの分割機能的(たしかあったような)なものでやっているのかなと思ったのですが、pixiの場合同じようなものがでてこなく、詰まったという感じです
5 件の回答
特に用意された機能ではないようだが。力技で分割してると思う。具体的には必要分の長方形を作って、それぞれの長方形に元画像をコピーしてマスクしてズラせばいい。Nivo Sliider っていうのが似たような事をする。
https://github.com/Codeinwp/Nivo-Slider-jQuery
これJSだけで実装できなかったっけ?
こんな感じのチュートリアル見たことあるぞ。
Webgl使うならシェーダー自前で書ける人なら実装できそう。pixi.jsは知らんけど。
このサイト、写真もテキストもボタンも全部一枚のcanvas上に描画してるんだな
マウスイベントなんかもJSで座標管理してやってるんだと思う
普通のスライダーのトランジションとは違うね
Re:4
はい、pixi.jsの公式サイトに乗っていた事例サイトでした。
そのため、コードがよめないんです;
Re:5
おそらくですが、As3でいうBitmapDataの分割機能的(たしかあったような)なものでやっているのかなと思ったのですが、pixiの場合同じようなものがでてこなく、詰まったという感じです