.thumb.png.267184132e48b991c16493df416343ce.png)
About This File
[size=5]Change the face of your website by using our NEW [b]Video Sliding Hotspot Mapper![/b][/size]
You’re witnessing the birth of an evolution! Yes, it’s the second generation of our [url="http://activeden.net/item/sliding-hotspot-mapper-as3/128890"]Sliding Hotspot Mapper[/url], now with YouTube and local video capabilities!
Infused with accuracy at a pixel level, the Video Sliding Hotspot Mapper features great customization capabilities and fulfills the demanding requirements of modern web design trends, while permitting seamless integration with your current design for a smart addition to your website’s visual interface.
Use the Video Sliding Hotspot Mapper as a unique, original, and creative means of capturing the attention of your website’s visitors towards several details that exist on an image of your choice.
The Video Sliding Hotspot Mapper application offers you design flexibility for an easier and more aesthetically pleasing user experience.
No matter if you’re using a small or very large image, no matter if the available space where you intend to display the image is tiny or you have a fullscreen browser window, you don’t have to worry about those details. The Video Sliding Hotspot Mapper is here to help you out. You can even use multiple instances of the Video Sliding Hotspot Mapper application embedded into the same HTML page, each showing its own image, with its own, specific hotspots. The only limit is your imagination. Finding out the needed hotspots location is a breeze. Each hotspot can easily be placed over the image with pixel-perfect accuracy thanks to the additional “[url="http://s3.envato.com/files/1205530/index_files/mapping_utility.html"]Locator[/url]” Application, which allows you to find out and automatically copy the location (X and Y coordinates) of each point of interest on your image, so you can then simply paste the copied code into the specific XML hotspot attribute.
[img]http://farm6.static.flickr.com/5215/5437072386_57327b5d54_z.jpg[/img][list]
[*]Easy to use and embed into your HTML page
[*]No Flash knowledge required
[*]Social-networks integration
[*]You can use images of any size, even very large ones
[*]Use the application in full-browser size or custom size
[*]Set XML path via Flashvars
[*]OOP -driven, uses [b]no Library items[/b]
[*]30 “global” settings + 14 settings for each hotspot – customize everything via XML
[*]Smart tooltips with optional image
[*]Define as many hotspots as you wish
[*]Easily place any hotspot with the “[url="http://s3.envato.com/files/1205530/index_files/mapping_utility.html"]Locator[/url]” Application
[/list]
The item makes use of the powerful [url="http://code.google.com/p/swfobject/"]SWFObject JavaScript library[/url], so you can easily embed the SWF into your HTML page.
When you buy the item, you get a very detailed, 19-page PDF userguide with screenshots that teaches you to fine-tune the Video Sliding Hotspot Mapper based on your specific preferences.
[img]http://farm6.static.flickr.com/5293/5436461773_92601ea5bc_z.jpg[/img]
[code=auto:0]<GeneralSettings> <componentWidth>0</componentWidth> <componentHeight>0</componentHeight> <loaderColor>0x000000</loaderColor> <slidingImage>_assets/circuit.jpg</slidingImage> <slidingSpeed>1.5</slidingSpeed> <hotspotsStopSliding>false</hotspotsStopSliding> <hotspotsOpacity>100</hotspotsOpacity> <hotspotHitarea>40</hotspotHitarea> <hotspotsUseHandCursor>true</hotspotsUseHandCursor> <hotspotsUseAnimation>true</hotspotsUseAnimation> <hotspotsAnimationWaves>7</hotspotsAnimationWaves> <hotspotsAnimationRepeatDelay>.4</hotspotsAnimationRepeatDelay> <tipsBufferSpace>15</tipsBufferSpace> <tipsBgColor>0x2B5414</tipsBgColor> <tipsBgOpacity>90</tipsBgOpacity> <tipsBgDropShadow>false</tipsBgDropShadow> <videoControlsColor>0x2B5414</videoControlsColor> <videoControlsBgOpacity>90</videoControlsBgOpacity> <videoDimmerOpacity>70</videoDimmerOpacity> <socialIcons drawerButtonImage="social/share_bt_1.png" drawerWidth="300" drawerHeight="45" drawerColor="0x405c2c" drawerOpacity="90" drawerLocation="TR" slidingSpeed="1" sideMargins="20" spacing="5" desaturate="true" overScaleAdd=".4"> <icon> <path>social/blogger_16.png</path> <uri frame="_blank">http://yourusername.blogger.com/</uri> <hint> <![CDATA[Visit our blog]]> </hint> </icon> </socialIcons> </GeneralSettings> <Hotspots> <hs> <location>441;1303</location><!-- horizontal location in px;vertical location in px --> <shape>STAR</shape><!-- available values: TRIANGLE, SQUARE, CIRCLE, CIRCLE_THIN, CIRCLE_THICK, DOT, CROSS, STAR --> <color>0x6CE02B</color><!-- HEX color of the hotspot shape --> <animColor>0x000</animColor><!-- HEX color of the "circular waves" animation --> <tooltip> <width>182</width><!-- tooltip width; use an integer or "auto" for the tooltip to be as wide as the text it contains --> <thumbnail>_assets/th_rider_seat.jpg</thumbnail><!-- the thumbnail image - optional, leave empty if you don't want to use a thumbnail --> <description> <![CDATA[<p align="center"><b>Rider Seat</b></p><br /><p align="justify">The component allows you to set <b>19</b> <i>Global Parameters</i>. You can customize each hotspot (and also the video it will open upon click) individually in XML by modifying as many as <b>14</b> <i>Specific Parameters</i>.<br /><br />You can even choose between YouTube videos and FLV, MP4, MOV, or H264 videos.<br /><br /></p><p align="center">For instance, this hotspot will open a YouTube video.</p>]]> </description> <position>TL</position><!-- available values: TL, TC, TR, CL, CR, BL, BC, BR --> <video> <type>youtube</type><!-- available values: video, youtube --> <uri>ZnSFmNRD-hQ</uri><!-- either a path to the video file, or the 11-char Identifier of the YouTube video --> <width>480</width><!-- width of the video player --> <height>360</height><!-- height of the video player --> <volume>50</volume><!-- initial audio volume of the video --> <autoPlay>false</autoPlay><!-- start playing the video automatically? --> </video> </tooltip> </hs>[/code]
You’re witnessing the birth of an evolution! Yes, it’s the second generation of our [url="http://activeden.net/item/sliding-hotspot-mapper-as3/128890"]Sliding Hotspot Mapper[/url], now with YouTube and local video capabilities!
Infused with accuracy at a pixel level, the Video Sliding Hotspot Mapper features great customization capabilities and fulfills the demanding requirements of modern web design trends, while permitting seamless integration with your current design for a smart addition to your website’s visual interface.
Use the Video Sliding Hotspot Mapper as a unique, original, and creative means of capturing the attention of your website’s visitors towards several details that exist on an image of your choice.
The Video Sliding Hotspot Mapper application offers you design flexibility for an easier and more aesthetically pleasing user experience.
No matter if you’re using a small or very large image, no matter if the available space where you intend to display the image is tiny or you have a fullscreen browser window, you don’t have to worry about those details. The Video Sliding Hotspot Mapper is here to help you out. You can even use multiple instances of the Video Sliding Hotspot Mapper application embedded into the same HTML page, each showing its own image, with its own, specific hotspots. The only limit is your imagination. Finding out the needed hotspots location is a breeze. Each hotspot can easily be placed over the image with pixel-perfect accuracy thanks to the additional “[url="http://s3.envato.com/files/1205530/index_files/mapping_utility.html"]Locator[/url]” Application, which allows you to find out and automatically copy the location (X and Y coordinates) of each point of interest on your image, so you can then simply paste the copied code into the specific XML hotspot attribute.
[img]http://farm6.static.flickr.com/5215/5437072386_57327b5d54_z.jpg[/img][list]
[*]Easy to use and embed into your HTML page
[*]No Flash knowledge required
[*]Social-networks integration
[*]You can use images of any size, even very large ones
[*]Use the application in full-browser size or custom size
[*]Set XML path via Flashvars
[*]OOP -driven, uses [b]no Library items[/b]
[*]30 “global” settings + 14 settings for each hotspot – customize everything via XML
[*]Smart tooltips with optional image
[*]Define as many hotspots as you wish
[*]Easily place any hotspot with the “[url="http://s3.envato.com/files/1205530/index_files/mapping_utility.html"]Locator[/url]” Application
[/list]
The item makes use of the powerful [url="http://code.google.com/p/swfobject/"]SWFObject JavaScript library[/url], so you can easily embed the SWF into your HTML page.
When you buy the item, you get a very detailed, 19-page PDF userguide with screenshots that teaches you to fine-tune the Video Sliding Hotspot Mapper based on your specific preferences.
[img]http://farm6.static.flickr.com/5293/5436461773_92601ea5bc_z.jpg[/img]
[code=auto:0]<GeneralSettings> <componentWidth>0</componentWidth> <componentHeight>0</componentHeight> <loaderColor>0x000000</loaderColor> <slidingImage>_assets/circuit.jpg</slidingImage> <slidingSpeed>1.5</slidingSpeed> <hotspotsStopSliding>false</hotspotsStopSliding> <hotspotsOpacity>100</hotspotsOpacity> <hotspotHitarea>40</hotspotHitarea> <hotspotsUseHandCursor>true</hotspotsUseHandCursor> <hotspotsUseAnimation>true</hotspotsUseAnimation> <hotspotsAnimationWaves>7</hotspotsAnimationWaves> <hotspotsAnimationRepeatDelay>.4</hotspotsAnimationRepeatDelay> <tipsBufferSpace>15</tipsBufferSpace> <tipsBgColor>0x2B5414</tipsBgColor> <tipsBgOpacity>90</tipsBgOpacity> <tipsBgDropShadow>false</tipsBgDropShadow> <videoControlsColor>0x2B5414</videoControlsColor> <videoControlsBgOpacity>90</videoControlsBgOpacity> <videoDimmerOpacity>70</videoDimmerOpacity> <socialIcons drawerButtonImage="social/share_bt_1.png" drawerWidth="300" drawerHeight="45" drawerColor="0x405c2c" drawerOpacity="90" drawerLocation="TR" slidingSpeed="1" sideMargins="20" spacing="5" desaturate="true" overScaleAdd=".4"> <icon> <path>social/blogger_16.png</path> <uri frame="_blank">http://yourusername.blogger.com/</uri> <hint> <![CDATA[Visit our blog]]> </hint> </icon> </socialIcons> </GeneralSettings> <Hotspots> <hs> <location>441;1303</location><!-- horizontal location in px;vertical location in px --> <shape>STAR</shape><!-- available values: TRIANGLE, SQUARE, CIRCLE, CIRCLE_THIN, CIRCLE_THICK, DOT, CROSS, STAR --> <color>0x6CE02B</color><!-- HEX color of the hotspot shape --> <animColor>0x000</animColor><!-- HEX color of the "circular waves" animation --> <tooltip> <width>182</width><!-- tooltip width; use an integer or "auto" for the tooltip to be as wide as the text it contains --> <thumbnail>_assets/th_rider_seat.jpg</thumbnail><!-- the thumbnail image - optional, leave empty if you don't want to use a thumbnail --> <description> <![CDATA[<p align="center"><b>Rider Seat</b></p><br /><p align="justify">The component allows you to set <b>19</b> <i>Global Parameters</i>. You can customize each hotspot (and also the video it will open upon click) individually in XML by modifying as many as <b>14</b> <i>Specific Parameters</i>.<br /><br />You can even choose between YouTube videos and FLV, MP4, MOV, or H264 videos.<br /><br /></p><p align="center">For instance, this hotspot will open a YouTube video.</p>]]> </description> <position>TL</position><!-- available values: TL, TC, TR, CL, CR, BL, BC, BR --> <video> <type>youtube</type><!-- available values: video, youtube --> <uri>ZnSFmNRD-hQ</uri><!-- either a path to the video file, or the 11-char Identifier of the YouTube video --> <width>480</width><!-- width of the video player --> <height>360</height><!-- height of the video player --> <volume>50</volume><!-- initial audio volume of the video --> <autoPlay>false</autoPlay><!-- start playing the video automatically? --> </video> </tooltip> </hs>[/code]
