Centrage des pages Web horizontalement et verticalement avec jQuery

-2

Quelqu'un peut-il me dire ce qui ne va pas avec ce code? J'essaye de centrer mes pages Web verticalement et horizontalement mais ceci ne fonctionne pas! Ce n'est pas centré pour moi.Centrage des pages Web horizontalement et verticalement avec jQuery

<html> 
<head> 
    <title>String Functions</title> 
    <script type="text/javascript" src="js/jquery-1.5.2.min.js"></script> 
    <script type="text/javascript"> 
    jQuery.fn.center = function() { 
    this.css("position", "absolute"); 
    this.css("top", ($(document).height() - this.height())/2 + $(document).scrollTop() + "px"); 
    this.css("left", ($(document).width() - this.width())/2 + $(document).scrollLeft() + "px"); 
    return this; 
    }; 

    $("#d1").center(); 
    </script>  
</head> 

<body> 

<div id="d1" style="background-color:red;width:100px; height: 100px;"></div>  

</body>

Source

2011-06-27 davidz

Quel problème voyez-vous? Je ne vois pas un ... J'ai changé de fenêtre pour document. http://jsfiddle.net/euALd/ – CrazyDart

Bonjour, ce n'est pas du tout centré sur moi. Le code ci-dessus est ce que j'ai. – davidz

Ça marche aussi pour moi. Quel navigateur utilisez-vous? Et la console lance-t-elle une erreur? – Ivan

Essayez plutôt.

jQuery.fn.center = function() { 
    this.css({ 
     "position" : "absolute", 
     "top" : "50%", 
     "left" : "50%", 
     "margin-left" : (this.width()/2) * -1, 
     "margin-top" : (this.width()/2) * -1 
    }); 
};

Un moyen très fiable pour centrer un élément en position absolue est de fixer sa position à gauche ou supérieure à 50%, puis sa marge de -Demi la largeur ou la hauteur de l'objet.

Source

2011-06-27 22:12:18 Jedediah

Centrage des pages Web horizontalement et verticalement avec jQuery

Répondre

Questions connexes