J'utilise jQuery UI pour certaines améliorations de base des pages. Boutons et style de saisie et boîtes de dialogue modales. Maintenant, je suis tombé sur Bootstrap et ça a l'air plutôt bien.
Quelqu'un a-t-il une expérience de l'utilisation de jQuery UI à Bootstrap? C'est ce que je pense faire, mais avant de le faire, je voudrais être conscient des problèmes que je pourrais rencontrer.
Une solution possible qui n'était peut-être pas disponible lorsque cela a été demandé ... Addy Osmani et son équipe ont travaillé sur la fusion des deux - si vous êtes coincé entre eux, consultez et peut-être que vous pouvez obtenir tout ce que vous voulez! - addyosmani.github.io/jquery-ui-bootstrap
lampadaire
1
Comment mettre à jour (2014!) Les réponses? Quelqu'un peut-il commencer une prime ici?
Peter Krauss
Depuis le site Web de Bootstrap - "Bootstrap ne prend en charge qu'une seule fenêtre modale à la fois. Les modaux imbriqués ne sont pas pris en charge car nous pensons qu'ils constituent une mauvaise expérience utilisateur." - Bon deuil.
George Beier
Réponses:
133
J'ai sur plusieurs projets.
La plus grande différence à mon avis
jQuery UI est de secours, il fonctionne correctement et semble bon dans les anciens navigateurs, où Bootstrap est basé sur CSS3, ce qui signifie essentiellement GRAND dans les nouveaux navigateurs, pas si bon dans les anciens
Fréquence de mise à jour: Bootstrap reçoit de très grandes mises à jour avec de nouvelles fonctionnalités impressionnantes, mais malheureusement, elles pourraient casser le code précédent, donc vous ne pouvez pas simplement installer bootstrap et mettre à jour quand il y a une nouvelle version majeure, cela nécessite essentiellement beaucoup de nouveau codage
jQuery UI est basé sur une bonne structure html avec des transformations à partir de JavaScript, tandis que Bootstrap est basé sur une structure en ligne visuellement et personnalisable. (appeler un widget dans l'interface utilisateur JQUERY, le définir dans Bootstrap)
Alors que choisir?
Cela dépend toujours du type de projet sur lequel vous travaillez. Les widgets cool et rapides sont-ils meilleurs ou vos utilisateurs utilisent-ils souvent d'anciens navigateurs?
Je finis toujours par utiliser les deux, donc je peux utiliser le meilleur des deux mondes.
Voici les liens vers les deux frameworks, si vous décidez de les utiliser.
-Merci d'avoir pris le temps de répondre. Mes besoins sont pour quelque chose qui fonctionne sur IE9 ou les autres navigateurs de versions ultérieures qui ont un assez bon support CSS3. Bootstrap commence à bien paraître pour moi. Une question. J'utilise ASP.MVC. J'ai remarqué quelque chose sur le fait d'avoir besoin de moins. Boostrap fonctionnera-t-il correctement avec la plate-forme Microsoft ASP MVC? Où se situe «moins»?
Jessica
Vous pouvez compiler le moins de fichiers en fichiers .css. Construire le bootstrap (en utilisant make), créera des fichiers CSS prêts à l'emploi. De cette façon, vous n'avez pas besoin d'en utiliser moins.
mikaelb
3
MOINS est un framework CSS. Il n'est en aucun cas nécessaire pour utiliser Boostrap (ils ont une version CSS / JS régulière), mais avec MOINS, vous pouvez facilement créer des variables en CSS (changer les couleurs, etc.), le rendre dépendant, avoir des fonctions. Voir ici: lesscss.org et il existe une version BETA pour un compilateur en .NET voir: dotlesscss.org
Marco Johannesen
20
Comment utilisez-vous même le "meilleur des deux mondes"? Le plus proche que j'ai obtenu est d'utiliser jQueryUI Bootstrap (essentiellement un thème jQueryUI) mais il est toujours conçu pour Bootstrap 1.4, et non 2.0, et il y a des conflits lorsque j'essaie d'utiliser JS pour les boutons, etc.
Adam Lynch
3
@ PhoenixX_2 mal essayer! Exemple: dans bootstrap, vous écrivez toutes les classes sur l'élément bouton (c'est-à-dire button button-primary button-smalloù, dans jQueryUI, vous affectez un élément à un bouton, c'est-à-dire ajoutez simplement "btn" puis via JS vous en faites un bouton $(".btn").button(). Cela signifie que dans Bootstrap vous définissez-le en HTML, et dans jQueryUI vous le définissez dans JS. Les points négatifs sur Bootstrap sont que vous devez modifier votre HTML si vous mettez à jour / changez quelque chose (par exemple. versions Bootstrap) où jQueryUI vous avez juste besoin de changer votre JS, ce qui est souvent plus facile. Il y a des points positifs et négatifs avec les deux! :)
Marco Johannesen
73
Ayant utilisé les deux, Twitter Bootstrap est un ensemble de technologies supérieures. Voici quelques différences,
Widgets : jQuery UI gagne ici. Le widget de date qu'il fournit est extrêmement utile et Twitter Bootstrap ne fournit rien de ce genre.
Échafaudage : Bootstrap gagne ici. La grille de Twitter à la fois fluide et fixe est de premier ordre. jQuery UI ne fournit même pas cette direction, laissant la mise en page à l'utilisateur final.
Professionnalisme hors de la boîte : Bootstrap utilisant CSS3 est à des lieues, l'interface utilisateur jQuery semble datée par comparaison.
Icônes : je vais attacher celui-ci. Bootstrap a de plus belles icônes à mon humble avis que jQuery UI , mais je n'aime pas du tout les termes, les Glyphicons Halflings ne sont normalement pas disponibles gratuitement, mais un arrangement entre Bootstrap et les créateurs de Glyphicons a rendu cela possible sans frais pour vous en tant que développeurs. En guise de remerciement, nous vous demandons d'inclure un lien facultatif vers Glyphicons chaque fois que cela est possible.
Images et miniatures : va à Bootstrap , jQuery UI n'aide même pas ici.
Autres notes,
Il est important de comprendre comment ces deux technologies se font également concurrence dans les sphères. Il y a beaucoup de chevauchements, mais si vous voulez un échafaudage simple et une création fixe / fluide, Bootstrap n'est pas une autre technologie, c'est la meilleure technologie. Si vous voulez un widget unique, jQuery UI n'est probablement même pas dans les trois premiers. Aujourd'hui, jQuery UI n'est principalement qu'un jouet de cohérence et de preuve de concept pour une création de widget côté client utilisant un cadre unifié.
Vous pouvez utiliser les deux avec relativement peu de problèmes. Twitter Bootstrap utilise jQuery 1.7.1 (au moment de la rédaction de ce document), et je ne vois aucune raison pour laquelle vous ne pouvez pas intégrer de composants d'interface utilisateur Jquery supplémentaires dans vos modèles HTML.
J'ai utilisé une combinaison de HTML5 Boilerplate et Twitter Bootstrap construit sur Initializr.com. Cela combine deux modèles de démarrage impressionnants dans un grand projet de démarrage. Consultez les détails sur http://html5boilerplate.com/ et http://www.initializr.com/ Ou pour commencer tout de suite, allez sur http://www.initializr.com/ , cliquez sur le "Bootstrap 2" et cliquez sur "Télécharger". Cela vous donnera tous les js et css dont vous avez besoin pour commencer.
Et ne soyez pas effrayé par HTML5 et CSS3. Initializr et HTML5 Boilerplate incluent des polyfills et du code spécifique à IE qui permettront à toutes les fonctionnalités de fonctionner dans IE 6, 7 8 et 9.
L'utilisation de LESS dans Twitter Bootstrap est également facultative. Ils utilisent MOINS pour compiler tout le CSS utilisé par Bootstrap, mais si vous voulez simplement remplacer ou ajouter vos propres styles, ils fournissent un fichier CSS vide à cet effet.
Il existe également un fichier js vierge (script.js) pour vous permettre d'ajouter du code personnalisé. C'est là que vous ajouteriez vos gestionnaires ou sélecteurs pour des composants jQueryUI supplémentaires.
Très bonne réponse. Question rapide difficile, qu'est-ce que jquery ui offre vraiment qui n'est pas inclus dans twitter bootstrap et ses plugins?
MindWire
5
Désolé, je viens de voir ça. En ce qui concerne les widgets js, jQuery UI a un sélecteur de date et un curseur, qui ne sont pas inclus dans Bootstrap. JqUI comprend également des interactions et des effets, tels que le glisser-déposer, afficher / masquer les animations, le basculement de classe et plusieurs autres. La combinaison des interactions de jqUI avec les composants de mise en page de Bootstrap peut être une combinaison très puissante.
eterps
6
Un problème à surveiller; les deux projets définissent $ .fn.button de manière incompatible.
Levi
27
Nous avons utilisé les deux et nous aimons Bootstrap pour sa simplicité et le rythme auquel il est développé et amélioré. Le problème avec jQuery UI est qu'il se déplace à un rythme d'escargot. Il faut des années pour déployer des fonctionnalités communes telles que la barre de menus, le contrôle d'arborescence et DataGrid, qui sont à jamais en phase de planification / développement. Nous avons attendu attendu attendu et finalement abandonné et utilisé d'autres bibliothèques comme ExtJS pour notre produit http://dblite.com .
Bootstrap a mis au point un ensemble de fonctionnalités assez complet en très peu de temps et je suis sûr qu'il dépassera bientôt l'interface utilisateur jQuery.
Je ne vois donc aucun intérêt à utiliser quelque chose qui sera finalement dépassé ...
Tout sera finalement dépassé. Il est inutile de faire quoi que ce soit.
tilgovi
6
Certes, nous avons juste besoin de choisir celui qui, selon nous, tiendra plus longtemps.
Rajiv
8
Non, il vous suffit de choisir celui qui va rapporter l'argent de vos clients. Une fois que vous l'avez fait fonctionner, il devrait continuer à fonctionner pendant un certain temps, même s'il ne fonctionne plus, donc la seule vraie préoccupation est l'argent.
Réponses:
J'ai sur plusieurs projets.
La plus grande différence à mon avis
jQuery UI est de secours, il fonctionne correctement et semble bon dans les anciens navigateurs, où Bootstrap est basé sur CSS3, ce qui signifie essentiellement GRAND dans les nouveaux navigateurs, pas si bon dans les anciens
Fréquence de mise à jour: Bootstrap reçoit de très grandes mises à jour avec de nouvelles fonctionnalités impressionnantes, mais malheureusement, elles pourraient casser le code précédent, donc vous ne pouvez pas simplement installer bootstrap et mettre à jour quand il y a une nouvelle version majeure, cela nécessite essentiellement beaucoup de nouveau codage
jQuery UI est basé sur une bonne structure html avec des transformations à partir de JavaScript, tandis que Bootstrap est basé sur une structure en ligne visuellement et personnalisable. (appeler un widget dans l'interface utilisateur JQUERY, le définir dans Bootstrap)
Alors que choisir?
Cela dépend toujours du type de projet sur lequel vous travaillez. Les widgets cool et rapides sont-ils meilleurs ou vos utilisateurs utilisent-ils souvent d'anciens navigateurs?
Je finis toujours par utiliser les deux, donc je peux utiliser le meilleur des deux mondes.
Voici les liens vers les deux frameworks, si vous décidez de les utiliser.
la source
button button-primary button-smalloù, dans jQueryUI, vous affectez un élément à un bouton, c'est-à-dire ajoutez simplement "btn" puis via JS vous en faites un bouton$(".btn").button(). Cela signifie que dans Bootstrap vous définissez-le en HTML, et dans jQueryUI vous le définissez dans JS. Les points négatifs sur Bootstrap sont que vous devez modifier votre HTML si vous mettez à jour / changez quelque chose (par exemple. versions Bootstrap) où jQueryUI vous avez juste besoin de changer votre JS, ce qui est souvent plus facile. Il y a des points positifs et négatifs avec les deux! :)Ayant utilisé les deux, Twitter Bootstrap est un ensemble de technologies supérieures. Voici quelques différences,
Autres notes,
la source
Vous pouvez utiliser les deux avec relativement peu de problèmes. Twitter Bootstrap utilise jQuery 1.7.1 (au moment de la rédaction de ce document), et je ne vois aucune raison pour laquelle vous ne pouvez pas intégrer de composants d'interface utilisateur Jquery supplémentaires dans vos modèles HTML.
J'ai utilisé une combinaison de HTML5 Boilerplate et Twitter Bootstrap construit sur Initializr.com. Cela combine deux modèles de démarrage impressionnants dans un grand projet de démarrage. Consultez les détails sur http://html5boilerplate.com/ et http://www.initializr.com/ Ou pour commencer tout de suite, allez sur http://www.initializr.com/ , cliquez sur le "Bootstrap 2" et cliquez sur "Télécharger". Cela vous donnera tous les js et css dont vous avez besoin pour commencer.
Et ne soyez pas effrayé par HTML5 et CSS3. Initializr et HTML5 Boilerplate incluent des polyfills et du code spécifique à IE qui permettront à toutes les fonctionnalités de fonctionner dans IE 6, 7 8 et 9.
L'utilisation de LESS dans Twitter Bootstrap est également facultative. Ils utilisent MOINS pour compiler tout le CSS utilisé par Bootstrap, mais si vous voulez simplement remplacer ou ajouter vos propres styles, ils fournissent un fichier CSS vide à cet effet.
Il existe également un fichier js vierge (script.js) pour vous permettre d'ajouter du code personnalisé. C'est là que vous ajouteriez vos gestionnaires ou sélecteurs pour des composants jQueryUI supplémentaires.
la source
Nous avons utilisé les deux et nous aimons Bootstrap pour sa simplicité et le rythme auquel il est développé et amélioré. Le problème avec jQuery UI est qu'il se déplace à un rythme d'escargot. Il faut des années pour déployer des fonctionnalités communes telles que la barre de menus, le contrôle d'arborescence et DataGrid, qui sont à jamais en phase de planification / développement. Nous avons attendu attendu attendu et finalement abandonné et utilisé d'autres bibliothèques comme ExtJS pour notre produit http://dblite.com .
Bootstrap a mis au point un ensemble de fonctionnalités assez complet en très peu de temps et je suis sûr qu'il dépassera bientôt l'interface utilisateur jQuery.
Je ne vois donc aucun intérêt à utiliser quelque chose qui sera finalement dépassé ...
la source