📜 ⬆️ ⬇️

Rotating items without flash

Hello.

I want to provide you with a jQuery plugin for you, which allows you to implement a three-dimensional display of items (for example, phones or laptops in the online store catalog)

Perhaps everyone met such tools based on flash technology. However, I believe that its use is not what it is. Therefore, having spent several hours, I implemented a similar javascript functionality as a jQuery plugin.
')


Opportunities




How does it work



Of course, we need photos of the item we want to show.
They all fit in some div.

< div class ="beonoGlobus" >
< div class ="beonoGlobus-images" >
< img src ="3d-1.jpg" />
...
< img src ="3d-6.jpg" />
</ div >
< div class ="beonoGlobus-navigation" > ... </ div >
</ div >
</ div >


* This source code was highlighted with Source Code Highlighter .


We hang the plugin.

$( ".beonoGlobus" ).beonoGlobus();

* This source code was highlighted with Source Code Highlighter .


All this can be packaged in any component of your cms and automatically connected for each product of the catalog.

Where to twist


Official page of the project
Google Code Project

Important : The current α-version (0.5) is suitable for use, but still “damp” for using the api of plug-in objects. I think by the end of the month I will give the code in order. Also in the plans to implement the rotation vertically.
© as part of the GPLv2

UPDATE start
All similar tools on flash are made on the principle of photo switching.
I didn’t have a task to do some other 3D representation through canvas and the like.
You need to show the user the subject from all sides? You are welcome!
Honestly, I do not know how to do this in another way.
Build image via canvas? - Hang the user's browser.

Flash examples:

pleer.ru/3dfoto/indexf.php?p=17730
3df.ru/3d/canon-eos-350-d-kit
www.3dbin.com

This is a flash and it just switches the pictures.
My task was to implement the same thing without a flash!

Thanks to all! :)

UPDATE end

In the comments I want to know how interesting this tool is (especially as an alternative to flash versions), suggestions and criticism.

Source: https://habr.com/ru/post/69897/


All Articles