Skip to the content
devfrontend.info

Le bloc-notes professionnel d'un développeur front-end senior

Show menu Hide menu

  • [Javascript] Ressources en ligne, bonnes pratiques
  • [Magento 2] Ressources en ligne
  • [Magento] Ressources en ligne
  • [UIkit] ressources en ligne et bonnes pratiques
  • [Webpack] Ressources en ligne et bonnes pratiques
  • [WordPress] Ressources en ligne
  • Liens
  • Outils en ligne
  • Plan du site
  • Ressources vidéos en ligne
  • UX/UI Design, transformation digitale, stratégie digitale, webmarketing (secteur automobile)
  • Veille technique et technologique du développeur Front-End, les bonnes adresses
  • Workflow Front-end 2018
  • [Javascript] Ressources en ligne, bonnes pratiques
  • [Magento 2] Ressources en ligne
  • [Magento] Ressources en ligne
  • [UIkit] ressources en ligne et bonnes pratiques
  • [Webpack] Ressources en ligne et bonnes pratiques
  • [WordPress] Ressources en ligne
  • Liens
  • Outils en ligne
  • Plan du site
  • Ressources vidéos en ligne
  • UX/UI Design, transformation digitale, stratégie digitale, webmarketing (secteur automobile)
  • Veille technique et technologique du développeur Front-End, les bonnes adresses
  • Workflow Front-end 2018

Articles récents

  • [Javascript] Manipuler les objets JSON, astuces et bonnes pratiques
  • [Magento 2] Utiliser les arguments dans les layouts XML pour afficher/masquer sous condition certaines zones d’un template PHTML
  • [Javascript] Uncaught ReferenceError: x is not defined – Attendre qu’un objet, une variable, un élément du DOM soit présent avant d’exécuter du code
  • [Magento 2] Validation des champs de formulaire via les UI components, ressources en ligne et astuces
  • [Favicon] Astuces et bonnes pratiques de mise en place

Catégories

  • Accessibilité
  • Admin configuration scope
  • Adobe Audition
  • Angular
  • AngularJS
  • Bac à sable
  • Block template system
  • Bonnes pratiques
  • Brackets
  • Change cross commerce
  • CSS
  • Customization of template files
  • Customizing look and feel
  • Design fallback
  • Development workflow
  • Docker
  • Drupal 7
  • Ergonomie
  • Foundation 6
  • Git
  • Google Maps
  • Gulp
  • HTML
  • Hybris
  • Internationalization
  • Javascript
  • Javascript creation & Customization
  • jQuery
  • JSP
  • LESS
  • Linux
  • Locate files / directory structure
  • Machine virtuelle
  • Magento
  • Magento 2
  • Magento 2.x
  • MySQL
  • Performances
  • Photoshop
  • PHP
  • Pimcore
  • Popcorn
  • Préparation projet
  • Prestashop
  • RBS Change
  • RBS Cooking
  • Responsive Design
  • SASS
  • scss
  • SEO
  • SPIP
  • SSH
  • Twitter Bootstrap
  • Ubuntu
  • UIKit v3
  • Uncategorized
  • UX Design
  • Vectoriel
  • Virtualisation
  • Webdesign
  • Webmarketing
  • Webpack
  • Wordpress
  • XML layout

Tags

array bootstrap bouton breakpoint checkbox click css docker dropdown Drupal 7 each fonction formulaire Foundation 6 grille Gulp image input javascript jquery js layout LESS liste magento media-queries menu mixin npm objet php phtml produit radio requireJS responsive sass surcharge table tableau template theme ubuntu widget xml

Archives

  • mars 2023
  • février 2023
  • janvier 2023
  • décembre 2022
  • août 2022
  • juillet 2022
  • juin 2022
  • mai 2022
  • février 2022
  • janvier 2022
  • décembre 2021
  • mai 2021
  • avril 2021
  • mars 2021
  • février 2021
  • janvier 2021
  • décembre 2020
  • novembre 2020
  • octobre 2020
  • septembre 2020
  • août 2020
  • juillet 2020
  • juin 2020
  • mai 2020
  • avril 2020
  • mars 2020
  • février 2020
  • janvier 2020
  • décembre 2019
  • novembre 2019
  • octobre 2019
  • août 2019
  • juillet 2019
  • juin 2019
  • avril 2019
  • mars 2019
  • février 2019
  • janvier 2019
  • décembre 2018
  • novembre 2018
  • octobre 2018
  • septembre 2018
  • août 2018
  • juillet 2018
  • juin 2018
  • mai 2018
  • avril 2018
  • mars 2018
  • février 2018
  • janvier 2018
  • décembre 2017
  • novembre 2017
  • octobre 2017
  • septembre 2017
  • août 2017
  • juillet 2017
  • juin 2017
  • mai 2017
  • avril 2017
  • mars 2017
  • février 2017
  • janvier 2017
  • décembre 2016
  • novembre 2016
  • septembre 2016
  • août 2016
  • juillet 2016
  • juin 2016
  • mai 2016
  • avril 2016
  • mars 2016
  • février 2016
  • janvier 2016
  • décembre 2015
  • novembre 2015
  • octobre 2015
  • septembre 2015
  • août 2015
  • juillet 2015
  • juin 2015
  • avril 2015
  • mars 2015
  • février 2015
  • janvier 2015
  • décembre 2014
  • novembre 2014
  • octobre 2014
  • septembre 2014
  • août 2014
  • juillet 2014
  • juin 2014
  • mai 2014
  • avril 2014
  • mars 2014
  • février 2014
  • janvier 2014
  • novembre 2013
  • octobre 2013
  • septembre 2013
  • août 2013
  • juillet 2013
  • juin 2013
  • mai 2013
  • avril 2013
  • mars 2013
  • janvier 2013
  • décembre 2012
  • novembre 2012

Méta

  • Connexion
  • Flux des publications
  • Flux des commentaires
  • Site de WordPress-FR

Étiquette : conolles

[jQuery] Bootstrap 3 et affix ne conserve pas la pleine largeur d’un élément si j’utilise les classes de la grille

19/02/2019 / admin

1
2
3
4
5
6
7
8
9
10
11
12
13
        <div id="pageStickyHeader" class="row page-StickyHeader">
          <div class="col-lg-2">
            <img src="image/logoCALL-new.jpg" alt="" class="img-responsive" />
          </div>
          <div class="col-lg-8">
            <form class="form-inline">
              <label for="input-id" class="sr-only">Rechercher un produit</label>
              <input type="text" name="" id="input" class="form-control" value="" required="required" pattern="" title="" placeholder="Rechercher un produit">
              <button type="submit" class="btn btn-default"><i class="glyphicon glyphicon-search"></i><span class="sr-only">Rechercher</span></button>
            </form>
          </div>
          <div class="col-lg-2">Favoris | Panier</div>
        </div>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
  // Partie sticky du bandeau
  let $pageStickyHeader = $('#pageStickyHeader');
  let $pageStickyHeaderWidth = $('#pageStickyHeader').width();
 
  $pageStickyHeader
    .affix({
      offset: {
        top: 100,
        bottom: function () {
          return (this.bottom = $('#pageFooter').outerHeight(true))
        }
      }
    })
    .on('affix.bs.affix', function() {
      $(this).css('width', $pageStickyHeaderWidth);
    })
    .on('affix-top.bs.affix', function() {
      $(this).removeAttr('style');
    });
    // Fin: Partie sticky du bandeau

1
2
3
4
5
.page-StickyHeader.affix {
  top: 0px;
  z-index: 100;
  background: #fff;
}

© 2023 devfrontend.info

Theme by Anders Norén — Up ↑