J'ai une page web qui est, en fin de compte, un tas de boîtes de dialogue jquery-ui, toutes les 30% de largeur d'écran, dans trois colonnes, contenant des informations sur le tableau de bord d'un genre différent.Besoin d'une solution de contournement pour .position() bug dans jquery-ui/webkit
Je charge les données dans divs, et sur la fonction $ (document) .ready(), je crée les boîtes de dialogue et les superpose les unes sur les autres dans différentes colonnes, en fonction du type de données affichage.
J'utilise une variation de ce code pour chaque div (je prévois de le rendre plus propre quand je le ferai fonctionner correctement, alors s'il vous plaît pardonnez sa redondance). D'abord, je crée la boîte de dialogue si elle contient des données:
//show recent posts if they exist below the account requests
if($('#recentPosts').html().length > 0){
$('#recentPosts')
.dialog({
title: 'Recent Forum Messages',
height: 320
})
.parent().addClass('cfdialog').attr('id', 'recentPostsDialog');
} else {
$('#recentPosts').addClass('cfdialog').attr('id', 'recentPostsDialog');
}
... cela est nécessaire, parce que je dois être en mesure de saisir la boîte de dialogue entier (je ne comprends pas pourquoi il n'y a pas de mécanisme pour attribuer facilement une ID à un div de dialogue); après tous mes dialogues sont créés, je fais quelque chose comme ceci:
//now that the dialogs are set up, position them.
var leftContent = $('#columnTop');
var centerContent = $('#columnTop');
var rightContent = $('#columnTop');
$('.cfdialog')
.css('width', '30%')
.css('height', 'auto')
.css('max-height', '400');
...
$('#recentPostsDialog')
.position({
my: 'center top',
at: 'center bottom',
of: centerContent,
offset: '0 5'
});
if ($('#recentPostsDialog').html().length > 0){
centerContent = $('#recentPostsDialog');
}
Cela permet d'afficher les messages dans une boîte de dialogue comme je voudrais dans FireFox et IE. Pour Chrome, cependant, les boîtes de dialogue font apparaître environ 30 pixels et interfèrent avec mes éléments de menu. J'ai lu pas mal de choses sur SO et les forums de jquery suggérant que cela est dû à la façon dont les corrections calculées par webkit, et quelqu'un a posté un correctif, mais cela ne semble pas fonctionner dans cette situation. Est-ce que quelqu'un peut me donner des indices sur la façon de contourner le problème des navigateurs basés sur Webkit?
Êtes-vous sûr que les boîtes de dialogue est la bonne solution pour cela? –
Pour être honnête, non, je ne pense pas que ce soit, mais je ne pense pas non plus que c'est mon problème dans ce cas –
C'est un peu. Vous essayez d'aligner des 'div's absolument positionnés (qui seraient attachés au bas du' body') par dessus d'autres éléments, ce qui ne semble même pas correct et produit exactement le genre de problèmes auxquels je m'attendrais. essayer de créer des widgets avec le bouton collapse/close, alors la boîte de dialogue n'est vraiment pas la bonne solution.Vous avez probablement besoin de quelque chose 'draggable', mais physiquement positionné à l'intérieur de vos colonnes –