JavaScript Library Models Image Rotating Of Flash

ImageRotatorJS is a JavaScript library models image rotation feature for Flash with pure JS code to create 3D image rotation with realistic perspective and reflections.

detect text orientation in image, perspective transform css, css perspective example

How to make use of it:

1. Download and import ImageRotator-min.js to the webpage.

<script src="ImageRotator-min.js"></script>

2. The elements to be displayed in the rotor are defined in the HTML code and must be assigned a class name that includes a unique string of characters.

<div id="Ellipse">
 <img class="RotatingIcon"  src="img/img11.jpg">
 <img class="RotatingIcon"  src="img/img10.jpg">
 <img class="RotatingIcon"  src="img/img1.jpg">
 <img class="RotatingIcon"  src="img/img9.jpg">
 <img class="RotatingIcon"  src="img/img1.png">
 <img class="RotatingIcon"  src="img/img2.jpg">
</div>

3. Usually each application is initialized from a <BODY> or event called when the window is loaded to run “ImageRotatorJS”.

<body onload="ImageRotatorJS('Ellipse','RotatingIcon',5,110,3000, 0, 90, 40, 'white');">

4. There are two rotation control functions, “IRJS_StartRotation” and “IRJS_StopRotation”.

<!-- Calling this function will stop the ellipse rotation.-->
<!-- parameter 0 =(string) the unique ID name of the parent DIV.-->
<input type="button" name="" value="Stop" onmouseover="IRJS_StopRotation('Ellipse1');">
<!-- Calling this function will rotate the ellipse to an incremental point. -->
<!-- parameter 0 =(string) the unique ID name of the parent DIV. -->
<!-- parameter 1 =(1 | -1) the direction of rotation, 1 = clockwise, -1 = anti clockwise. -->
<!-- parameter 2 =(digits) (optional) to change the 'Hold' delay. -->
<input type="button" name="" value="Next" onclick="IRJS_StartRotation('Ellipse1',1);">
<input type="button" name="" value="Back" onclick="IRJS_StartRotation('Ellipse1',-1);">

3D Perspective Image Rotator With Reflections, ImageRotatorJS Plugin/Github