spin-360

KO | EN

gitlite — search

#react #typescript #llm #go #android #rust #deep-learning #nodejs #macos #windows #cli #vue #mcp #open-source

(★ 17)

spin-360 360 derece detaylı resim gösterimi için geliştirilmiş ve geliştirilmektedir.

spin-360 최신버젼 다운로드

최종 버전 다운로드 (.zip)

// repository documentation

Was this content helpful?

★ 0 (0 ratings)

# spin-360

> `npm install spin-360`

spin-360 360 derece detaylı resim gösterimi için geliştirilmiş ve geliştirilmektedir.

360 derece ürün gösterimi ve özellikle e-ticaret siteleri için uygundur.

## API

$(element).spin360(options);

## Parametreler - Options

* `width`: (`Integer`) Görsel alanının genişliği - Default (`500`)
* `height`: (`Integer`) - Görsel alanının yüksekliği - Default (`500`)
* `datas`: (`Array`) - 360 derece gösterilmesi istenen nesnenin sıralı listesi.
* `imgClass`: (`String`) - Görsellerin alacağı class değeri - Default (`spin-image`)
* `type`: (`String`) - 'images' ya da 'video' - Default (`images`)
* `lazyLoad`: (`boolean`) - Aktif olmayan görsellerin sayfaya yüklenmesini bekletir. Aktif olduktan sonra yükleyip, yüklenme zamanını dengeler - Default(`true`)

## Kullanımı - Usage

İlk olarak 'Jquery' ve 'spin-360' scriptleri sayfaya dahil edilir.

```javascript
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script type="text/javascript" src="scripts/spin360.js"></script>
/* Daha sonra 360 derece görselimizin görüneceği alan oluşturulur. */
```

```html
<div id="360Image"></div>
```

Son olarak spin-360 pluginimiz tetiklendikten sonra projemiz kullanılmaya hazırdır.

```javascript
var spin = $('#360Image').spin360({
    width: 500,
    height: 500,
    imgClass: 'spin-image',
    datas: [
        "images/Tv/product01.jpg",
        "images/Tv/product02.jpg",
        "images/Tv/product03.jpg",
        "images/Tv/product04.jpg",
        "images/Tv/product05.jpg",
        "images/Tv/product06.jpg",
        "images/Tv/product07.jpg",
        "images/Tv/product08.jpg",
        "images/Tv/product09.jpg",
        "images/Tv/product10.jpg",
        "images/Tv/product11.jpg",
        "images/Tv/product12.jpg",
        "images/Tv/product13.jpg",
        "images/Tv/product14.jpg",
        "images/Tv/product15.jpg",
        "images/Tv/product16.jpg",
        "images/Tv/product17.jpg",
        "images/Tv/product18.jpg",
        "images/Tv/product19.jpg",
        "images/Tv/product20.jpg",
        "images/Tv/product21.jpg",
        "images/Tv/product22.jpg",
        "images/Tv/product23.jpg",
        "images/Tv/product24.jpg",
        "images/Tv/product25.jpg",
        "images/Tv/product26.jpg",
        "images/Tv/product27.jpg",
        "images/Tv/product28.jpg",
        "images/Tv/product29.jpg",
        "images/Tv/product30.jpg",
        "images/Tv/product31.jpg",
        "images/Tv/product32.jpg",
        "images/Tv/product33.jpg",
        "images/Tv/product34.jpg",
        "images/Tv/product35.jpg",
        "images/Tv/product36.jpg"
    ],
    lazyLoad: true
});
```

Projeyi çalıştırdıktan sonra durdurmak istiyorsanız:

spin.destroy();

spin-360

spin-360 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

spin-360

spin-360 최신버젼 다운로드

오늘의 추천 프로젝트

Was this content helpful?

Recent Feedback

Download README