jQuery

Réduire
X
 
  • Filtrer
  • Heure
  • Afficher
Tout effacer
nouveaux messages

  • [RÉGLÉ] jQuery

    Bonjour,

    j’insère un petit code JavaScript externe dans mon template mais sans charger jQuery celui-ci ne fonctionne pas ?
    Code PHP:
    script src="<?php echo $this->baseurl ?>/media/jui/js/jquery.js">
    Je pensais que Joomla-3 chargeait la librairie de jQuery automatiquement, je me trompe ??
    Code PHP:
    JHtml::_('bootstrap.framework'); 
    merci.
    Dernière édition par olima à 26/07/2013, 13h47

  • #2
    Re : jQuery

    Salut,
    toujours consulter la reference :

    J3.1:Javascript Frameworks - Joomla! Documentation


    Ne voudrais-tu pas charger jQuery.UI ?
    En ce cas, c'est :

    JHtml::_('jquery.ui');
    * appeler un script
    regarde l'index.php de beez3, c'est un modele du genre.

    En le décomposant :
    <?php
    $doc = JFactory::getDocument();
    -
    -
    -
    JHtml::_('bootstrap.framework');
    // on est sur d'avoir jQuery+bootstrap
    $doc->addScript($this->baseurl . '/templates/' . $this->template . '/javascript/monscript.js', 'text/javascript');
    // on récupère monscript.js placé dans un dossier "javascript" dans le template
    ?>
    NB : ce script sera présent sur TOUTES les pages générées par Joomla
    Un message d’erreur sur votre site Joomla ... ayez le reflexe de consulter lla base de connaissance : https://kb.joomla.fr

    Ce forum, vous l'aimez ? il vous a sauvé la vie ? Vous y apprenez chaque jour ? Alors adhérez à l'AFUJ https://www.joomla.fr/association/adherer

    Commentaire


    • #3
      Re : jQuery

      salut
      effectivement si tu charges bootstrap tu chargeras jquery, mais si tu veux juste charger jquery ce code devrait suffir :
      JHtml::_('jquery.framework', true);
      le "true" permet d'ajouter le noconflict
      pour info j'ai récapitulé ça dans une cheatsheet joomla 3 :


      CEd
      Vive Joomla! http://www.joomlack.fr Tutoriels et extensions pour Joomla!. Livre création de template Joomla de plus de 200 pages.
      http://www.template-creator.com Outil de création de templates
      Module Maximenu CK - Megamenu, multicolonnes, chargement de module, description de lien, deroulement animé - Compatible Virtuemart, Hikashop

      Commentaire


      • #4
        Re : jQuery

        Code PHP:
        // Add JavaScript Frameworks
        JHtml::_('bootstrap.framework');
        $doc->addScript($this->baseurl '/templates/' $this->template '/js/monscript.js''text/javascript'); 
        Tout est chargé pourtant, mais non ??
        Je ne comprends plus rien ??
        Dernière édition par olima à 25/07/2013, 20h42

        Commentaire


        • #5
          Re : jQuery

          N'oublie pas :

          $doc = JFactory::getDocument();
          Il faut définir $doc (ou $document), c'est juste une variable.

          Référence :
          Adding JavaScript and CSS to the page - Joomla! Documentation


          De manière générale:
          $document = JFactory::getDocument();
          //add css
          $document->addStyleSheet($this->baseurl . '/templates/' . $this->template . '/css/macss.css');
          // Add script
          $document->addScript($this->baseurl . '/templates/' . $this->template . '/js/monscript.js', 'text/javascript');
          Un message d’erreur sur votre site Joomla ... ayez le reflexe de consulter lla base de connaissance : https://kb.joomla.fr

          Ce forum, vous l'aimez ? il vous a sauvé la vie ? Vous y apprenez chaque jour ? Alors adhérez à l'AFUJ https://www.joomla.fr/association/adherer

          Commentaire


          • #6
            Re : jQuery

            Code PHP:
            // Getting params from template
            $params JFactory::getApplication()->getTemplate(true)->params;
            $app JFactory::getApplication();
            $doc JFactory::getDocument();
            $this->language $doc->language;
            $this->direction $doc->direction;
            /
            /
            /
            // Add JavaScript Frameworks
            JHtml::_('bootstrap.framework');
            $doc->addScript($this->baseurl '/templates/' $this->template '/js/teste2.js''text/javascript'); 
            Cette variable est déjà déclarée par défaut dans l'index PHP (template/protostar) ??
            Est-ce un problème de positionnement dans l'index ou mon script externe qui n'est pas compris
            ou encore, est-ce le fait que je travail en local ?

            Code PHP:
            $(window).scroll( function() {
                var 
            value = $(window).scrollTop();
                if ( 
            value 300 )
                    $(
            ".itemid-101 header").css("background""red");
                else
                    $(
            ".itemid-101 header").css("background""#123456");
            }); 
            Dernière édition par olima à 26/07/2013, 12h40

            Commentaire


            • #7
              Re : jQuery

              Il faut comprendre 2 choses :
              1- dans la mesure où ton script est envoyé dans <head> (par les différentes manips citées précédemment et propres à joomla),
              il faudrait l'encapsuler dans un document ready

              $(document).ready(function(){
              //ton code
              });
              2 -(firebug activé évidemment)
              s'il y a un conflit quelconque et si le script noconflict n'est pas lancé
              NB : à priori Protostar le lance, mais ce n'est pas le cas de tous les templates
              tu peux aussi essayer de l'encapsuler dans une fonction :

              (function($) {

              $(document).ready(function(){
              //ton code
              });
              }(jQuery));
              Un message d’erreur sur votre site Joomla ... ayez le reflexe de consulter lla base de connaissance : https://kb.joomla.fr

              Ce forum, vous l'aimez ? il vous a sauvé la vie ? Vous y apprenez chaque jour ? Alors adhérez à l'AFUJ https://www.joomla.fr/association/adherer

              Commentaire


              • #8
                Re : jQuery

                Code PHP:
                (function($) {
                    $(
                document).ready(function(){
                                               
                            $(
                window).scroll( function() {
                                var 
                value = $(window).scrollTop();
                                if ( 
                value 300 )
                                    $(
                ".itemid-101 header").css("background""red");
                                else
                                    $(
                ".itemid-101 header").css("background""yellow");
                            });
                    });
                }(
                jQuery)); 
                Encapsulé dans une fonction mon script fonctionne enfin.
                Merci pour votre aide.
                Dernière édition par olima à 26/07/2013, 13h50

                Commentaire

                Annonce

                Réduire
                Aucune annonce pour le moment.

                Partenaire de l'association

                Réduire

                Hébergeur Web PlanetHoster
                Travaille ...
                X