Rafraichir un objet JS
prosthetiks
Messages postés
1309
Statut
Membre
-
prosthetiks Messages postés 1309 Statut Membre -
prosthetiks Messages postés 1309 Statut Membre -
Bonjour,
Voici mon problème:
J'ai un objet javascript dont la valeur est un calcul prenant en compte la largeur de la fenêtre du navigateur.
Je souhaiterais qu'au moment du redimensionnement de la fenêtre, la valeur de mon objet soit recalculée avec la nouvelle largeur. Pour être plus clair, voici un exemple de ce qui ne fonctionne pas:
toto.elements.width aura la valeur de la largeur de la fenêtre au moment du rendu de la page, et ne se mettre plus à jour avec la nouvelle valeur de la fenêtre redimensionnée.
Quelqu'un connaît-il une parade pour avoir un comporte dynamique ?
Merci d'avance :)
Voici mon problème:
J'ai un objet javascript dont la valeur est un calcul prenant en compte la largeur de la fenêtre du navigateur.
Je souhaiterais qu'au moment du redimensionnement de la fenêtre, la valeur de mon objet soit recalculée avec la nouvelle largeur. Pour être plus clair, voici un exemple de ce qui ne fonctionne pas:
<html>
<head>
<title></title>
<style type="text/css">
.debug{
width: 400px;
height: 300px;
background-color: lightblue;
overflow:auto;
}
.debug div{
width: 100%;
border-bottom:red solid 1px;
text-align: left;
}
</style>
</head>
<body>
<div class="debug"></div>
</body>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.0.min.js"></script>
<script type="text/javascript">
var toto = {
i:0,
elements: {
width: $(window).width(),
height: $(window).height()
},
_initialize: function(){
this.addEventListener();
return this;
},
addEventListener: function(){
$(window).resize(function(){
var me = totoInstance;
totoInstance.addDebug('width:' + me.elements.width + ' --- ' + 'height:' + me.elements.height)
})
},
addDebug: function(string){
this.i++;
$('.debug').prepend('<div>'+this.i+':'+string+'</div>');
}
}
var totoInstance = toto._initialize();
</script>
</html>
toto.elements.width aura la valeur de la largeur de la fenêtre au moment du rendu de la page, et ne se mettre plus à jour avec la nouvelle valeur de la fenêtre redimensionnée.
Quelqu'un connaît-il une parade pour avoir un comporte dynamique ?
Merci d'avance :)
A voir également:
- Rafraichir un objet JS
- Vente objet occasion entre particulier - Guide
- Identifier un objet à partir d'une photo - Guide
- Mesurer un objet - Guide
- Objet interdit en cabine ryanair - Guide
- Arrondi js ✓ - Forum Windows
2 réponses
J'arrive sans autre à détecter la resize, le problème est la mise a jour de la valeur de mon objet. J'ai bidouillé une solution, mais je pense qu'il y a moyen de faire mieux.
<html>
<head>
<title></title>
<style type="text/css">
.debug{
width: 400px;
height: 300px;
background-color: lightblue;
overflow:auto;
}
.debug div{
width: 100%;
border-bottom:red solid 1px;
text-align: left;
}
</style>
</head>
<body>
<div class="debug"></div>
</body>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.0.min.js"></script>
<script type="text/javascript">
var toto = {
i:0,
elements: {},
baseElements:'elements = {width: $(window).width(),height: $(window).height()}',
_initialize: function(){
this.addEventListener();
return this;
},
addEventListener: function(){
$(window).resize(function(){
var me = totoInstance;
me.elements = eval(me.baseElements);
totoInstance.addDebug('width:' + me.elements.width + ' --- ' + 'height:' + me.elements.height)
})
},
addDebug: function(string){
this.i++;
$('.debug').prepend('<div>'+this.i+':'+string+'</div>');
},
getWidth: function(){
return $(window).width();
}
}
var totoInstance = toto._initialize();
</script>
</html>
