Ajouter un remplissage lors du chargement et du redimensionnement de la page

-1

Je calcule le remplissage d'un élément et l'ajoute au redimensionnement. Maintenant, je voudrais l'ajouter aussi sur le chargement de la page. Comment puis je faire ça?Ajouter un remplissage lors du chargement et du redimensionnement de la page

Live demo

$(window).resize(function() { 
    var widthWindow = $(window).width(); 
    var widthContainer = $("#container").width(); 
    var calculatePadding = (widthWindow - widthContainer)/2; 
    $("#container").css({ 
     "padding-top":calculatePadding, 
     "padding-bottom":calculatePadding 
    }); 
}).resize();

Source

2017-04-11 didi

Essayez-vous de centrer les éléments? – Neil

mettre la fonction dans '$ (function() {/*here...*/});' –

Non, je ne veux pas centrer les éléments. Le code fonctionne bien, je veux juste l'exécuter aussi sur le chargement de la page (d'ailleurs sur le redimensionnement). – didi

Vous pouvez le faire de cette façon:

<body onload="resize()">

en Javascript:

function resize(){ 
    //write your stuff here 
}

(OR) la façon dont jQuery

$(document).ready(function(){ 
    resize(); 
});

Source

2017-04-11 09:11:53 Nagaraju

Il suffit de lier votre gestionnaire à l'événement de chargement:

var handler = function() { 
    var widthWindow = $(window).width(); 
    var widthContainer = $("#container").width(); 
    var calculatePadding = (widthWindow - widthContainer)/2; 
    $("#container").css({ 
     "padding-top":calculatePadding, 
     "padding-bottom":calculatePadding 
    }); 
}; 

$(window).resize(handler) 
$(window).load(handler)

Ou un peu plus élégant, à mon avis:

$(window).on('load, resize', handler)

Source

2017-04-11 09:12:07

Merci, mais cela ne fonctionne pas, vérifiez ma démo mise à jour en direct. – didi

Ma solution fonctionne correctement. https://jsfiddle.net/4xjdopc9/1/ –

Cela ne fonctionne pas du tout ... bizarre. Sur quel navigateur êtes-vous? Je suis sur Google Chrome version 57.0.2987.133 – didi

Ajouter un remplissage lors du chargement et du redimensionnement de la page

Répondre

Questions connexes