Come aggiungere javascript condizionale al tema?


10

Vorrei usare lo script Selectivizr per emulare i selettori CSS3 in IE6-8.

Ma faccio fatica ad aggiungerlo al mio tema. Finora provato:

1) Costringendolo nella sezione head di html.tpl.php:

<!--[if lt IE 9]>
<script src="<?php print base_path() . path_to_theme(); ?>/js/selectivizr.js"></script>
<![endif]-->

Ma base_path () non sembra restituire nulla in D7 (almeno in html.tpl.php - forse in page.tpl.php ...). E so che questo non è il modo Drupal di farlo comunque.

2) Aggiunta al file .info del mio tema:

scripts[] = selectivizr.js

Ma poi è incondizionato, ovviamente :(

3) Uso di drupal_add_js () nel mio template.php.

Ma ancora una volta, non sono sicuro che possa essere impostato condizionatamente lì?

Risposte:


3

Penso che il tuo 1) sia l'opzione migliore.

Non è necessario chiamare alcuna funzione, hai già quei valori:

<script type="text/javascript" src="<?php print $base_path . $directory; ?>/js/selectivizr.js"></script>

Cordiali saluti, <?php dsm($variables) ?>in qualsiasi file modello per vedere quali variabili sono disponibili. (con modulo di sviluppo installato)

Esiste un modulo Fogli di stile condizionale che ha una soluzione elegante per aggiungere condizioni IE nel file .info, ma ancora solo per CSS. (vedi richiesta di funzionalità per JS)


15

Ecco come ho aggiunto html5shiv nel mio file template.php:

$html5shiv = array(
  '#tag' => 'script',
  '#attributes' => array( // Set up an array of attributes inside the tag
    'src' => drupal_get_path('theme', 'mythemename') . '/js/lib/html5shiv.js', 
  ),
  '#prefix' => '<!--[if lte IE 8]>',
  '#suffix' => '</script><![endif]-->',
);
drupal_add_html_head($html5shiv, 'html5shiv');

4
Un paio di modifiche: aggiungi '#value' e impostalo su '' quindi cambia '#suffix' in '<! [Endif] ->' per ottenere un markup conforme agli standard.
Angry Dan,

A cura del suggerimento di @ AngryDan.
wizonesolutions,

1

Ho pensato che fosse cotto ma era sbagliato.

Sembra che il tema della nave madre usi questa librabria.

L'IT fa le cose in modo leggermente diverso da te ma essenzialmente fa la tua opzione 1

  $vars['selectivizr'] = '<!--[if (gte IE 6)&(lte IE 8)]>';
  $vars['selectivizr'] .= '<script type="text/javascript" src="/sites/all/libraries/selectivizr/selectivizr.js"></script>';
  $vars['selectivizr'] .= '<![endif]-->';

Sembra che questo codice non funzionerà se il tuo sito non è in /

Ma se la libreria è necessaria per il tuo tema, non vedo alcun problema nel mettere il codice condizionale nel file page.tpl.php.


È possibile modificare il percorso delle librerie hard coded per utilizzare libraries_get_path () se si utilizzano le librerie api o drupal_get_path () se non lo si è.
Masterchief


1

Se il tuo file JS non ha dipendenze, può essere incluso in questo modo nel tag head di HTML:

$selectivizr = array(
  '#tag' => 'script',
  '#attributes' => array(
    'src' => file_create_url(drupal_get_path('theme', 'theme_name') . '/js/lib/selectivizr.js'),
  ),
  '#prefix' => '<!--[if lte IE 9]>',
  '#suffix' => '</script><![endif]-->'
);
drupal_add_html_head($selectivizr, 'selectivizr');

Se hai, diciamo, la dipendenza jQuery, ha senso mettere il tuo codice in fondo alla pagina:

function THEMENAME_preprocess_html(&$vars){
  $vars['page']['page_bottom']['jquery_dependent_js'] = array(
    'footer' => array(
      '#type' => 'markup',
      '#markup' => '<!--[if lte IE 9]><script src="' .
        file_create_url(drupal_get_path('theme', 'theme_name') . '/js/lib/jquery_dependent_js.js'). '"></script><![endif]-->',
    )     
  );
}

C'è un tag script aggiuntivo nel tuo primo blocco di codice, nella chiave #suffix.
Pol Dellaiera,
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.