# spin-360

> 360 degree detailed image presentation plugin

Latest version **0.0.5** (published 2017-03-21) · MIT license · 0 weekly downloads

## Install

```sh
npm install spin-360
pnpm add spin-360
yarn add spin-360
bun add spin-360
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.5 |
| Published | 2017-03-21 |
| First published | 2016-08-15 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 11 |
| Author | Volkan Tağal |
| Maintainers | volkantagal |
| Keywords | 360, degree, product, image, view, volkan, tagal |

## Links

- npm: https://www.npmjs.com/package/spin-360
- Repository: https://github.com/volkantagal/spin-360
- Homepage: https://github.com/volkantagal/spin-360#readme
- Issues: https://github.com/volkantagal/spin-360/issues
- npm.io page: https://npm.io/package/spin-360

## Alternatives

- [exif-parser](https://npm.io/package/exif-parser.md) — 3.8M weekly downloads
- [vite-plugin-compression](https://npm.io/package/vite-plugin-compression.md) — 569.5K weekly downloads
- [pica](https://npm.io/package/pica.md) — 442.4K weekly downloads
- [@reportportal/client-javascript](https://npm.io/package/@reportportal/client-javascript.md) — 408.8K weekly downloads
- [@tldraw/state](https://npm.io/package/@tldraw/state.md) — 316.0K weekly downloads

## Recent versions

- 0.0.5 (latest) — 2017-03-21
- 0.0.3 — 2016-08-16
- 0.0.2 — 2016-08-15
- 0.0.1 — 2016-08-15
- 1.0.0 — 2016-08-15

## README

# 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();

---
_Source: https://npm.io/package/spin-360 · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._