Ver Mensaje Individual
  #1 (permalink)  
Antiguo 18/12/2009, 10:21
Avatar de Vun
Vun
Colaborador
 
Fecha de Ingreso: agosto-2009
Ubicación: Benalmádena, España
Mensajes: 2.265
Antigüedad: 15 años, 5 meses
Puntos: 150
[Aporte] Simple boton flotante a la izquierda

Tras un rato buscando entre varios scripts, encontre uno, lo simplifique al maximo y asi queda el tipico boton a la izquierda que permanece aunque movamos la barra de scroll, sirve para IE+FF+CHROME. Pega en el body y listo:

Código HTML:
<script type="text/javascript">
<!--

var timer = null;
var floatHeight  = 80 + 3; //added margin
var floatWidth   = 50 + 3; //added margin

var obj = null;
var IE=0, NS=0;

	// Initializing function, must be called on onLoad event in BODY tag

function init()
{
    	 // get the object as per the browser
    obj = document.layers ? document.layers["float"] :		 
    document.getElementById ?  document.getElementById("float").style :
    document.all["float"].style;
								
         // Detect the browser
    IE  = (-1 != navigator.appVersion.indexOf("MSIE")) ? 1 : 0;
    NS  = ("Netscape" == navigator.appName) ? 1 : 0;

    positionFloat(1); 	 // position initially
    
         // repositioning the layer	
    if(IE)
    { 
         self.onscroll = function(){ positionFloat(1); }
         self.onresize = function(){ positionFloat(1); }   //when window is resized
    }
    else if(NS)
    { timer = setInterval("positionFloat(4)",10);}
}
 
	// Function which actually positions the layer 	

function positionFloat(iPos)
{
   if(IE)          // IE specific code
   {
		obj.left = document.body.scrollLeft;
		obj.top =  document.body.scrollTop+200;

   }
   else if(NS)     // Netscape specific code
   {
		obj.left = self.pageXOffset;
		obj.top =  self.pageYOffset+200;
   }
}
// -->
</script>


<div style="position:absolute; height:70px; width:40px; top:1; visibility:visible; z-index:999;" ID="float">
   <a href="http://www.facebook.com"><img src="http://triplew.rincondelmardc.com/facebook_button.png" border="0" height="40" width="40"></a>		
</div>
<script type="text/javascript">
init();
</script> 
Si lo quieren mas arriba o abajo cambien ese +200 por otra cantidad, ala, taulego!