0
タッチイベントでその回転を制御することによって、多くの画像を表示する360度の製品プレビューを作成したいと考えています。私はこれをjqueryプラグインで作成しましたが、これは角度jsで必要です。角度js.My jQueryのコードスニペットでこれを作成するために角度jsで360度の製品プレビュースライダーを作成
var ab=[
" https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0001.png",
" https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0001.png",
" https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0002.png",
" https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0003.png",
" https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0004.png",
" https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0005.png",
" https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0006.png",
" https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0007.png",
" https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0008.png",
" https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0009.png",
" https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0010.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0010.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0011.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0012.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0013.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0014.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0015.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0016.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0017.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0018.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0019.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0020.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0021.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0022.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0023.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0024.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0025.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0026.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0027.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0028.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0029.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0030.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0031.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0032.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0033.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0034.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0035.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0036.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0037.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0038.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0039.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0040.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0041.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0042.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0043.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0044.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0045.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0046.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0047.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0048.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0049.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0050.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0051.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0052.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0053.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0054.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0055.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0056.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0057.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0058.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0059.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0060.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0061.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0062.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0063.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0064.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0065.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0066.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0067.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0068.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0069.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0070.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0071.png","https://s.tmocache.com/content/dam/tmo/en-p/cell-phones/lg-g5/silver/spin/lg-g5-silver.spin.0072.png"];
$("#mySpriteSpin").spritespin({
// path to the source images.
source: ab,
width : 500, // width in pixels of the window/frame
height : 500, // height in pixels of the window/frame
sense: -1,
frame: 1,
animate: false
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script src="http://spritespin.ginie.eu/spritespin.js"></script>
<div id='mySpriteSpin'/>
おかげでプラグインangularjs 360製品ビューのために、このgithub linkに従うことができますが、そうではありません正しく働く –