Servicio de Enlaces

Contáctanos Leer Más

Servicio de INTERNET

Contáctanos Leer Más

Servicio de DATA CENTER

Contáctanos Leer Más

Servicio de Videovigilancia

Contáctanos Leer Más

Servicio de telefonía ip

Contáctanos Leer Más

CSS3 Animations

Animate Any Element
 
 

bounce

 
GET CODE
<img data-animation="bounce" data-animation-delay="1.5" src="/images/jf/gallery/image_4.jpg">

flash

 
GET CODE
<img data-animation="flash" data-animation-delay="1.5" src="/images/jf/gallery/image_4.jpg">
 

pulse

 
GET CODE
<img data-animation="pulse" data-animation-delay="1.5" src="/images/jf/gallery/image_4.jpg">

rubberBand

 
GET CODE
<img data-animation="rubberBand" data-animation-delay="1.5" src="/images/jf/gallery/image_4.jpg">
 

shake

 
GET CODE
<img data-animation="shake" data-animation-delay="1.5" src="/images/jf/gallery/image_4.jpg">

swing

 
GET CODE
<img data-animation="swing" data-animation-delay="1.5" src="/images/jf/gallery/image_4.jpg">
 

tada

 
GET CODE
<img data-animation="tada" data-animation-delay="1.5" src="/images/jf/gallery/image_4.jpg">

wobble

 
GET CODE
<img data-animation="wobble" data-animation-delay="1.5" src="/images/jf/gallery/image_4.jpg">
 
AND YOU CAN USE UNLIMITED CSS3 ANIMATIONS
For choosing CSS3 Animations please visit:
Animate.css   
 
Animate.css - http://daneden.github.io/animate.css/
 
 

Social Icons

Social Icons
 
 
GET CODE
<ul class="jf_social_icons">
	<li class="facebook"><a href="http://www.facebook.com/JoomForest" target="_blank" title="facebook">&nbsp;</a></li>
	<li class="twitter"><a href="http://twitter.com/#!/JoomForest" target="_blank" title="twitter">&nbsp;</a></li>
	<li class="google"><a href="https://plus.google.com/+JoomForest/" target="_blank" title="google+">&nbsp;</a></li>
	<li class="youtube"><a href="#" title="youtube">&nbsp;</a></li>
	<li class="soundcloud"><a href="#" title="soundcloud">&nbsp;</a></li>
	<li class="yahoo"><a href="#" title="yahoo">&nbsp;</a></li>
	<li class="ebay"><a href="#" title="ebay">&nbsp;</a></li>
	<li class="linkedin"><a href="#" title="linkedin">&nbsp;</a></li>
	<li class="vimeo"><a href="#" title="vimeo">&nbsp;</a></li>
	<li class="instagram"><a href="#" title="instagram">&nbsp;</a></li>
	<li class="tumblr"><a href="#" title="tumblr">&nbsp;</a></li>
	<li class="skype"><a href="#" title="skype">&nbsp;</a></li>
	<li class="pinterest"><a href="#" title="pinterest">&nbsp;</a></li>
	<li class="blogger"><a href="#" title="blogger">&nbsp;</a></li>
	<li class="dribbble"><a href="#" title="dribbble">&nbsp;</a></li>
	<div class="clear"></div>
</ul>
 
GET CODE
<ul class="jf_social_icons rotate">
	<li class="facebook"><a href="http://www.facebook.com/JoomForest" target="_blank" title="facebook">&nbsp;</a></li>
	<li class="twitter"><a href="http://twitter.com/#!/JoomForest" target="_blank" title="twitter">&nbsp;</a></li>
	<li class="google"><a href="https://plus.google.com/+JoomForest/" target="_blank" title="google+">&nbsp;</a></li>
	<li class="youtube"><a href="#" title="youtube">&nbsp;</a></li>
	<li class="soundcloud"><a href="#" title="soundcloud">&nbsp;</a></li>
	<li class="yahoo"><a href="#" title="yahoo">&nbsp;</a></li>
	<li class="ebay"><a href="#" title="ebay">&nbsp;</a></li>
	<li class="linkedin"><a href="#" title="linkedin">&nbsp;</a></li>
	<li class="vimeo"><a href="#" title="vimeo">&nbsp;</a></li>
	<li class="instagram"><a href="#" title="instagram">&nbsp;</a></li>
	<li class="tumblr"><a href="#" title="tumblr">&nbsp;</a></li>
	<li class="skype"><a href="#" title="skype">&nbsp;</a></li>
	<li class="pinterest"><a href="#" title="pinterest">&nbsp;</a></li>
	<li class="blogger"><a href="#" title="blogger">&nbsp;</a></li>
	<li class="dribbble"><a href="#" title="dribbble">&nbsp;</a></li>
	<div class="clear"></div>
</ul>
 
GET CODE
<ul class="jf_social_icons transparent">
	<li class="facebook"><a href="http://www.facebook.com/JoomForest" target="_blank" title="facebook">&nbsp;</a></li>
	<li class="twitter"><a href="http://twitter.com/#!/JoomForest" target="_blank" title="twitter">&nbsp;</a></li>
	<li class="google"><a href="https://plus.google.com/+JoomForest/" target="_blank" title="google+">&nbsp;</a></li>
	<li class="youtube"><a href="#" title="youtube">&nbsp;</a></li>
	<li class="soundcloud"><a href="#" title="soundcloud">&nbsp;</a></li>
	<li class="yahoo"><a href="#" title="yahoo">&nbsp;</a></li>
	<li class="ebay"><a href="#" title="ebay">&nbsp;</a></li>
	<li class="linkedin"><a href="#" title="linkedin">&nbsp;</a></li>
	<li class="vimeo"><a href="#" title="vimeo">&nbsp;</a></li>
	<li class="instagram"><a href="#" title="instagram">&nbsp;</a></li>
	<li class="tumblr"><a href="#" title="tumblr">&nbsp;</a></li>
	<li class="skype"><a href="#" title="skype">&nbsp;</a></li>
	<li class="pinterest"><a href="#" title="pinterest">&nbsp;</a></li>
	<li class="blogger"><a href="#" title="blogger">&nbsp;</a></li>
	<li class="dribbble"><a href="#" title="dribbble">&nbsp;</a></li>
	<div class="clear"></div>
</ul>
 
GET CODE
<ul class="jf_social_icons transparent rotate">
	<li class="facebook"><a href="http://www.facebook.com/JoomForest" target="_blank" title="facebook">&nbsp;</a></li>
	<li class="twitter"><a href="http://twitter.com/#!/JoomForest" target="_blank" title="twitter">&nbsp;</a></li>
	<li class="google"><a href="https://plus.google.com/+JoomForest/" target="_blank" title="google+">&nbsp;</a></li>
	<li class="youtube"><a href="#" title="youtube">&nbsp;</a></li>
	<li class="soundcloud"><a href="#" title="soundcloud">&nbsp;</a></li>
	<li class="yahoo"><a href="#" title="yahoo">&nbsp;</a></li>
	<li class="ebay"><a href="#" title="ebay">&nbsp;</a></li>
	<li class="linkedin"><a href="#" title="linkedin">&nbsp;</a></li>
	<li class="vimeo"><a href="#" title="vimeo">&nbsp;</a></li>
	<li class="instagram"><a href="#" title="instagram">&nbsp;</a></li>
	<li class="tumblr"><a href="#" title="tumblr">&nbsp;</a></li>
	<li class="skype"><a href="#" title="skype">&nbsp;</a></li>
	<li class="pinterest"><a href="#" title="pinterest">&nbsp;</a></li>
	<li class="blogger"><a href="#" title="blogger">&nbsp;</a></li>
	<li class="dribbble"><a href="#" title="dribbble">&nbsp;</a></li>
	<div class="clear"></div>
</ul>
 
 

ToolTips

Tooltips
 
Tooltip on left
Tooltip on top
Tooltip on bottom
Tooltip on right
 
GET CODE
<div class="jf_col grid_3" data-toggle="tooltip" data-placement="left" title="Tooltip on left">Tooltip on left</div>
<div class="jf_col grid_3" data-toggle="tooltip" data-placement="top" title="Tooltip on top">Tooltip on top</div>
<div class="jf_col grid_3" data-toggle="tooltip" data-placement="bottom" title="Tooltip on bottom">Tooltip on bottom</div>
<div class="jf_col grid_3 last-column" data-toggle="tooltip" data-placement="right" title="Tooltip on right">Tooltip on right</div>
 
 

Image Styles

Image Styles
 
 
Consectetur Adipiscing Elit
 
 
GET CODE

	Consectetur Adipiscing Elit
	
 
 
 
 
Consectetur Adipiscing Elit
 
 
GET CODE

	Consectetur Adipiscing Elit
	
 
 
 
 
Consectetur Adipiscing Elit
 
 
GET CODE

	Consectetur Adipiscing Elit
	
 
 
 
 
Consectetur Adipiscing Elit
Dolor Sit Amet
In Porttitor Porta
 
GET CODE

	Consectetur Adipiscing Elit
	

		
			
Dolor Sit Amet

			In Porttitor Porta
 
 
 
 
GET CODE