Tengo una barra de redes sociales en una web que necesito que cuando haga scroll esté como transparente y más pequeña. Logre que sea transparente pero no puedo hacer que se achique.
Cómo puedo hacerlo?
Este es el código html
Código HTML:
<div class="content_fullwidth"> <div id="redes" class="featured_section69" style="text-align:center;position:sticky;bottom:60px;display:block;position:fixed;"> <div class="container"> <ul> <li style="display: inline;margin-right:15px;"><a href="https://www.facebook.com/oficialidp?fref=nf" target="_blank"><img src="images/facebook.png" /></a></li> <li style="display: inline;margin-right:15px;"><a href="https://twitter.com/" target="_blank"><img src="images/twitter.png" /></a></li> <li style="display: inline;margin-right:15px;"><a href="https://www.linkedin.com/hp/?dnr=nLTRz8eCKiuUR-Je_kFQihjnKiuUR-DAJTFF" target="_blank"><img src="images/linkedin.png" /></a></li> <li style="display: inline;margin-right:15px;"><a href="https://plus.google.com/u/1/115557945341348737807/posts" target="_blank"><img src="images/google+.png" /></a></li> <li style="display: inline;margin-right:15px;"><a href="http://institutodelpetroleo.educativa.org/acceso.cgi?id_curso=" target="_blank"><img src="images/alumno.png" /></a></li> </ul> </div> </div><!-- end featured section 69 --> <div class="clearfix margin_top12"></div> </div><!-- end content area -->
Código:
Intente con width y con background-size pero nada.. <script type="text/javascript" src="transparente.js"></script> <script type="text/javascript"> $(function() { $(window).scroll(function(){ var scrollTop = $(window).scrollTop(); if(scrollTop != 0) $('#redes').stop().animate({'opacity':'0.2'},400); else $('#redes').stop().animate({'opacity':'0.2'},400); }); $('#redes').hover( function (e) { var scrollTop = $(window).scrollTop(); if(scrollTop != 0){ $('#redes').stop().animate({'opacity':'1'},400); } }, function (e) { var scrollTop = $(window).scrollTop(); if(scrollTop != 0){ $('#redes').stop().animate({'opacity':'1'},400); } } ); }); </script>
Me ayudan?
Gracias!!!!!