Comment dimensionnez-vous le bouton jQuery?

J'utilise le contrôle Button de l'interface utilisateur jQuery mais ne semble pas pouvoir ajuster la taille (largeur et hauteur). Voici le API documentation. J'ai essayé de définir un attribut STYLE, mais l'étiquette n'a pas été centrée correctement. Merci.Comment dimensionnez-vous le bouton jQuery?

Source

2010-04-27 Alex

Je viens d'essayer de lui donner une largeur via Firebug, il fonctionne et centres correctement. – adardesign

La largeur fonctionne, mais pas la hauteur. Pour changer la hauteur, utilisez padding-top et padding-bottom comme suggéré ci-dessous. –

Essayez ceci dans l'attribut style:

width: 300px; 
padding-top: 10px; 
padding-bottom: 10px;

$(element).css({ width: '300px', 'padding-top': '10px', 'padding-bottom': '10px' });

Source

2010-04-27 18:54:43

Merci, Jakob. Je suppose que la partie qui m'a intrigué était qu'il n'y avait pas de façon intégrée de le régler dans le contrôle Button. En d'autres termes, vous devez définir la largeur du bouton = "100px" et la hauteur = "25px" et calculer automatiquement le padding-top/bottom correct pour le LABEL. – Alex

Était-ce une question? La définition de la hauteur ne fonctionne pas car l'étiquette n'est pas centrée verticalement sur le bouton, mais plutôt décalée à l'aide du remplissage. Donc, pour définir une hauteur différente, vous devez utiliser padding-top et padding-bottom. –

Non, plus d'un commentaire sur le contrôle Button. Mais maintenant je comprends comment ça fonctionne. Merci :) – Alex

normalement:

$(theElement).css('height','...px').css('width','...px');

Source

2010-04-27 18:50:24 joanballester

Vous pouvez également passer '.css()' à un objet: '.css ({height: 10, width: 10})' –

Et .height ('Xpx') aussi (je pense) – joanballester

Vous pouvez définir le style des .ui-button.ui-widget (sans espace, doit avoir les deux classes). (Assurez-vous que votre feuille de style apparaît en dessous de celle de jquery ui). Vous pouvez également créer un style

.ui-button.ui-widget{ 
    height, width 
} 

.ui-button.ui-widget .ui-button-text{ 
    line-height, font-size 
}

Source

2011-09-19 03:28:16 scott

Vous pouvez styler l'élément avec une taille de police relative. Si votre bouton a la classe custume « buttonStyle » puis ajouter à la CSS

.buttonStyle{ 
font-size:0.8em; 
}

Source

2012-07-13 18:43:55 Usha

J'ai trouvé que la mise <small></small> autour des balises bouton aide beaucoup. Ce n'est bénéfique que dans certains cas, mais cela m'a aidé à réduire la taille d'un projet sur lequel je travaillais.

Source

2012-08-22 14:57:53 Savanetech

Mettre autour quoi? – aikeru

Fixe ... a dû rajouter des astuces pour faire ce que je montrais à l'origine. – Savanetech

Voici ma solution pour rendre le bouton de l'interface utilisateur jquery de la même largeur. D'abord, j'ai besoin d'une méthode pour obtenir la largeur maximale. Puis j'appelle cette méthode après avoir accroché le bouton et réglé la taille. exemple

$('.selector') 
     .button() 
     .each(getMaxWidth); 
    $('.selector').width(greatestWidth);

Source

2013-02-26 07:08:01

basé au large de cette documentation http://api.jquery.com/height/ ci-dessous pour les produits travaillés:

$('#mybutton').button({ icons: { primary: "ui-icon-plus" }, text: false}).height(20);

Source

2014-12-23 19:48:02

Comment dimensionnez-vous le bouton jQuery?

Répondre

Questions connexes