Image – iHover (General)

[TS-VCSC-Icon-Title title=”Image iHover Features” align=”center” font_family=”Default:regular” size=”48″ font_weight=”300″ highlight_allow=”true” highlight_color=”#2691bd” highlight_strings=”RmVhdHVyZXM=” el_file1=”” el_file2=””]
[TS_VCSC_Fancy_List list_type=”image” marker_image=”http://tekanewascripts.com/composium/wp-content/plugins/ts-visual-composer-extend/images/bullets/bullet_arrow_blue.png”]

  • 2 styles (circle + square)
  • 20 effects for circle layout
  • 15 effects for square layout
  • Fully responsive
  • Show / hide hover indicator handle
  • Multiple trigger events
  • Add CSS3 or standard tooltip

[/TS_VCSC_Fancy_List]

[TS_VCSC_Teaser_Block_Standalone image=”17330″ overlay=”#0094ff” info_position=”top” title=”Circle Effects 1 – 10″ font_title_family=”Default:regular” subtitle=”View a demo of the iHover circle effects 1 – 10.” font_content_family=”Default:regular” icon_position=”top” icon=”ts-awesome-eye” link=”url:http%3A%2F%2Ftekanewascripts.com%2Fvcextensions%2Fimage-ihover-circle-1%2F|title:Image%20%E2%80%93%20iHover%20(Circle)%201|”]
[TS_VCSC_Teaser_Block_Standalone image=”17331″ overlay=”#0094ff” title=”Circle Effects 11 – 20″ font_title_family=”Default:regular” subtitle=”View a demo of the iHover circle effects 11 – 20.” font_content_family=”Default:regular” icon_position=”top” icon=”ts-awesome-eye” link=”url:http%3A%2F%2Ftekanewascripts.com%2Fvcextensions%2Fimage-ihover-circle-2%2F|title:Image%20%E2%80%93%20iHover%20(Circle)%202|”]
[TS_VCSC_Teaser_Block_Standalone image=”17332″ overlay=”#0094ff” info_position=”top” title=”Square Effects 1 – 15″ font_title_family=”Default:regular” subtitle=”View a demo of the iHover square effects 1 – 15.” font_content_family=”Default:regular” icon_position=”top” icon=”ts-awesome-eye” link=”url:http%3A%2F%2Ftekanewascripts.com%2Fvcextensions%2Fimage-ihover-square%2F|title:Image%20%E2%80%93%20iHover%20(Square)|”]
[TS-VCSC-Spacer height=”20″][TS-VCSC-Icon-Title title=”Optional Click Events” align=”center” font_family=”Default:regular” size=”48″ font_weight=”300″ highlight_allow=”true” highlight_color=”#2691bd” highlight_strings=”Q2xpY2slMkMlMjBFdmVudHM=” el_file1=”” el_file2=””][TS_VCSC_Info_Notice panel_layout=”notice” panel_type=”info” panel_icon=”ts-awesome-info-circle”]

Aside from just using the iHover effect without any other event or linking the iHover element to another page or site, you can apply other events to the element as well.

[/TS_VCSC_Info_Notice][TS-VCSC-Spacer height=”40″]

YouTube in Lightbox

[TS-VCSC-Divider margin_top=”0″][TS_VCSC_Image_IHover ihover_image=”16158″ ihover_circle_effect=”effect16″ overlay_handle_color=”#0094ff” ihover_title=”YouTube in Lightbox” ihover_content=”Show a YouTube video in a lightbox.” ihover_event=”youtube” ihover_video_link=”https://www.youtube.com/watch?v=Fprp5Cz2BXI” ihover_video_related=”true” tooltip_content=”Click to view YouTube Video.” tooltip_css=”true”]

Vimeo in Lightbox

[TS-VCSC-Divider margin_top=”0″][TS_VCSC_Image_IHover ihover_image=”16162″ ihover_circle_effect=”effect15″ overlay_handle_color=”#0094ff” ihover_title=”Vimeo Lightbox” ihover_content=”Show a Vimeo video in a lightbox.” ihover_event=”vimeo” ihover_video_link=”http://vimeo.com/73485224″ tooltip_content=”Click to view Vimeo Video.” tooltip_css=”true”]

DailyMotion in Lightbox

[TS-VCSC-Divider margin_top=”0″][TS_VCSC_Image_IHover ihover_image=”16157″ ihover_circle_effect=”effect3″ overlay_handle_color=”#0094ff” ihover_title=”DailyMotion Video” ihover_content=”Show a DailyMotion video in a lightbox.” ihover_event=”dailymotion” ihover_video_link=”http://www.dailymotion.com/video/xpeima_berlin-timelapse-trailer-footage-online-de_creation” tooltip_content=”Click to view DailyMotion Video.” tooltip_css=”true”]

Image in Lightbox

[TS-VCSC-Divider margin_top=”0″][TS_VCSC_Image_IHover ihover_image=”16139″ ihover_style=”square” ihover_square_effect=”effect10″ overlay_handle_color=”#0094ff” ihover_title=”Image Lightbox” ihover_content=”Show the full image in a lightbox.” ihover_event=”image” tooltip_content=”Click to view image in lightbox.” tooltip_css=”true”]

Popup via Lightbox

[TS-VCSC-Divider margin_top=”0″][TS_VCSC_Image_IHover ihover_image=”16144″ ihover_style=”square” ihover_square_effect=”effect4″ overlay_handle_color=”#0094ff” ihover_title=”Modal Popup” ihover_content=”Show a modal popup via lightbox.” ihover_event=”popup” ihover_text=”WW91JTIwY2FuJTIwY3JlYXRlJTIwYSUyMG1vcmUlMjBkZXRhaWxlZCUyMGRlc2NyaXB0aW9uJTIwb2YlMjB0aGUlMjBpSG92ZXIlMjBpbWFnZSUyMGFuZCUyMHNob3clMjB0aGF0JTIwZGVzY3JpcHRpb24lMjB2aWElMjBtb2RhbCUyMHBvcHVwJTJDJTIwdXNpbmclMjB0aGUlMjBpbnRlZ3JhdGVkJTIwbGlnaHRib3glMjBzb2x1dGlvbi4lMjBZb3UlMjBjYW4lMjBldmVuJTIwdXNlJTIwY3VzdG9tJTIwSFRNTCUyMGNvZGUlMjB0byUyMGNyZWF0ZSUyMHRoZSUyMGRlc2NyaXB0aW9uLg==” tooltip_content=”Click to view modal popup.” tooltip_css=”true”]

iFrame in Lightbox

[TS-VCSC-Divider margin_top=”0″][TS_VCSC_Image_IHover ihover_image=”16168″ ihover_style=”square” ihover_square_effect=”effect9″ ihover_square_direction5=”right_to_left” overlay_handle_color=”#0094ff” ihover_title=”Image Lightbox” ihover_content=”Show image in lightbox.” ihover_event=”iframe” tooltip_content=”Click to view website in iFrame.” ihover_link=”url:http%3A%2F%2Fen.wikipedia.org%2Fwiki%2FCologne||target:%20_blank” tooltip_css=”true”]