Comentarios en: Centrar un div horizontal y verticalmente con jQuery http://www.bufa.es/centrar-div-jquery/ Recursos web en español Sat, 04 Feb 2012 20:47:15 +0000 hourly 1 http://wordpress.org/?v=3.3.1 Por: jose http://www.bufa.es/centrar-div-jquery/comment-page-1/#comment-1389 jose Wed, 14 Dec 2011 16:32:57 +0000 http://www.bufa.es/?p=295#comment-1389 y si en vez de tener un div con unas dimensiones establecidas, esas dimensiones son auto xq en dicho div se carga diferente contenido como podría solucionarlo? y si en vez de tener un div con unas dimensiones establecidas, esas dimensiones son auto xq en dicho div se carga diferente contenido como podría solucionarlo?

]]> Por: Ari http://www.bufa.es/centrar-div-jquery/comment-page-1/#comment-1386 Ari Wed, 07 Dec 2011 21:59:26 +0000 http://www.bufa.es/?p=295#comment-1386 Corrección! (function($){ $.fn.centrar = function(cont){ $(this).css('position','absolute'); $(this).css({top: ($(cont).height() - $(this).outerHeight())/2}); $(this).css({left: ($(cont).width() - $(this).outerWidth())/2}); } })(jQuery); Se le de posición absoluta al elemento a centrar :P Corrección!

(function($){
$.fn.centrar = function(cont){
$(this).css(‘position’,'absolute’);
$(this).css({top: ($(cont).height() – $(this).outerHeight())/2});
$(this).css({left: ($(cont).width() – $(this).outerWidth())/2});
}
})(jQuery);

Se le de posición absoluta al elemento a centrar :P

]]> Por: Ari http://www.bufa.es/centrar-div-jquery/comment-page-1/#comment-1353 Ari Mon, 21 Nov 2011 17:39:16 +0000 http://www.bufa.es/?p=295#comment-1353 Así es en Plugin Jquery - Ari Copyright :P (function($){ $.fn.center = function(cont){ $(this).css({top: ($(cont).height() - $(this).outerHeight())/2}); $(this).css({left: ($(cont).width() - $(this).outerWidth())/2}); } })(jQuery); Se llamaría así: $('#caja').centrar('body'); Donde dice #caja iría el elemento a centrar y en body (window o html) el contenedor, pudiendo ser el window-html-body u otro elemento (por ejemplo un icono centrado en un botón). Así es en Plugin Jquery – Ari Copyright :P

(function($){
$.fn.center = function(cont){
$(this).css({top: ($(cont).height() – $(this).outerHeight())/2});
$(this).css({left: ($(cont).width() – $(this).outerWidth())/2});
}
})(jQuery);

Se llamaría así:

$(‘#caja’).centrar(‘body’);

Donde dice #caja iría el elemento a centrar y en body (window o html) el contenedor, pudiendo ser el window-html-body u otro elemento (por ejemplo un icono centrado en un botón).

]]> Por: ddsign http://www.bufa.es/centrar-div-jquery/comment-page-1/#comment-1186 ddsign Thu, 25 Aug 2011 08:12:17 +0000 http://www.bufa.es/?p=295#comment-1186 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Untitled Document</title> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js" type="text/javascript"></script> <script> $(document).ready(function(){ $(window).resize(function(){ // aquí le pasamos la clase o id de nuestro div a centrar (en este caso "caja") $('.caja').css({ position:'absolute', left: ($(window).width() - $('.caja').outerWidth())/2, top: ($(window).height() - $('.caja').outerHeight())/2 }); }); // Ejecutamos la función $(window).resize(); }); </script>   </head> <body > <div class="caja" style="border:1px solid red; "> esta es la caja que quiero centrar </div>   </body> </html> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
<html xmlns="http://www.w3.org/1999/xhtml"&gt;
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js&quot; type="text/javascript"></script>
<script>
$(document).ready(function(){
$(window).resize(function(){

// aquí le pasamos la clase o id de nuestro div a centrar (en este caso "caja")
$(‘.caja’).css({
position:’absolute’,
left: ($(window).width() – $(‘.caja’).outerWidth())/2,
top: ($(window).height() – $(‘.caja’).outerHeight())/2
});

});
// Ejecutamos la función
$(window).resize();

});
</script>
 
</head>
<body >

<div class="caja" style="border:1px solid red; ">
esta es la caja que quiero centrar

</div>
 
</body>
</html>

]]> Por: ddsign http://www.bufa.es/centrar-div-jquery/comment-page-1/#comment-1185 ddsign Thu, 25 Aug 2011 08:10:15 +0000 http://www.bufa.es/?p=295#comment-1185 Satoru, tienes que llamar a la librería jquery primero, te paso este código: Untitled Document $(document).ready(function(){ $(window).resize(function(){ // aquí le pasamos la clase o id de nuestro div a centrar (en este caso "caja") $('.caja').css({ position:'absolute', left: ($(window).width() - $('.caja').outerWidth())/2, top: ($(window).height() - $('.caja').outerHeight())/2 }); }); // Ejecutamos la función $(window).resize(); }); esta es la caja que quiero centrar Satoru, tienes que llamar a la librería jquery primero, te paso este código:

Untitled Document

$(document).ready(function(){

$(window).resize(function(){

// aquí le pasamos la clase o id de nuestro div a centrar (en este caso “caja”)
$(‘.caja’).css({
position:’absolute’,
left: ($(window).width() – $(‘.caja’).outerWidth())/2,
top: ($(window).height() – $(‘.caja’).outerHeight())/2
});

});

// Ejecutamos la función
$(window).resize();

});

esta es la caja que quiero centrar

]]> Por: satoru http://www.bufa.es/centrar-div-jquery/comment-page-1/#comment-1173 satoru Tue, 16 Aug 2011 02:59:08 +0000 http://www.bufa.es/?p=295#comment-1173 hola podrias subir o enviarme un ejemplo mas completo por que me tira este error $ is not definet tendria que poner un encabezado de jquery para que lo acepte? hola podrias subir o enviarme un ejemplo mas completo por que me tira este error
$ is not definet
tendria que poner un encabezado de jquery para que lo acepte?

]]> Por: Joel http://www.bufa.es/centrar-div-jquery/comment-page-1/#comment-1135 Joel Wed, 29 Jun 2011 18:10:51 +0000 http://www.bufa.es/?p=295#comment-1135 excelente el ejemplo, probado y funcionando, gracias excelente el ejemplo, probado y funcionando, gracias

]]> Por: Ms http://www.bufa.es/centrar-div-jquery/comment-page-1/#comment-449 Ms Sat, 11 Sep 2010 17:38:13 +0000 http://www.bufa.es/?p=295#comment-449 esta misma configuracion se puede establecer para plugins? Como se puede crear una pagina con diferentes programaciones y ponerlas en el lugar adecuado de la pagiana. Gracias esta misma configuracion se puede establecer para plugins?
Como se puede crear una pagina con diferentes programaciones y ponerlas en el lugar adecuado de la pagiana.

Gracias

]]>