2012-09-20 3 views
1

Я jquery новичок, долгое время работаю с WordPress. Мне не удается заставить эти два скрипта работать; независимо от того, где я их включаю.Как обернуть эти функции jquery для WordPress?

После того, как я прочитал об этой проблеме на Codex, я знаю, что мне нужно изменить эти сценарии, чтобы работать с режимом без конфликтов в WordPress, но я не уверен, что именно мне нужно делать.

Может ли кто-нибудь помочь мне и объяснить мне, как это сделать в любое другое время? Спасибо.

function adjustIframes() 
{ 
    $('iframe').each(function(){ 
    var 
    $this  = $(this), 
    proportion = $this.data('proportion'), 
    w   = $this.attr('width'), 
    actual_w = $this.width(); 

    if (! proportion) 
    { 
     proportion = $this.attr('height')/w; 
     $this.data('proportion', proportion); 
    } 

    if (actual_w != w) 
    { 
     $this.css('height', Math.round(actual_w * proportion) + 'px'); 
    } 
    }); 
} 
$(window).on('resize load',adjustIframes); 

// DOM ready 
    $(function() { 

     // Create the dropdown base 
     $("<select />").appendTo("nav"); 

     // Create default option "Go to..." 
     $("<option />", { 
     "selected": "selected", 
     "value" : "", 
     "text" : "Go to..." 
     }).appendTo("nav select"); 

     // Populate dropdown with menu items 
     $("nav a").each(function() { 
     var el = $(this); 
     $("<option />", { 
      "value" : el.attr("href"), 
      "text" : el.text() 
     }).appendTo("nav select"); 
     }); 

     // To make dropdown actually work 
     // To make more unobtrusive: http://css-tricks.com/4064-unobtrusive-page-changer/ 
     $("nav select").change(function() { 
     window.location = $(this).find("option:selected").val(); 
     }); 

    }); 

if(document.createTouch) { 
    this.addEvent(c[j],'tap',this.tipOver,false); 
} else { 
    this.addEvent(c[j],'mouseover',this.tipOver,false); 
    this.addEvent(c[j],'mouseout',this.tipOut,false); 
} 

ответ

0

Включите код jquery в функции .ready. Ниже приведен код, измененный для режима jQuery noConflict.

jQuery(document).ready(function($) { 
    function adjustIframes() 
    { 
     $('iframe').each(function(){ 
     var 
     $this  = $(this), 
     proportion = $this.data('proportion'), 
     w   = $this.attr('width'), 
     actual_w = $this.width(); 

     if (! proportion) 
     { 
      proportion = $this.attr('height')/w; 
      $this.data('proportion', proportion); 
     } 

     if (actual_w != w) 
     { 
      $this.css('height', Math.round(actual_w * proportion) + 'px'); 
     } 
     }); 
    } 
    $(window).on('resize load',adjustIframes); 

    // DOM ready 
     $(function() { 

      // Create the dropdown base 
      $("<select />").appendTo("nav"); 

      // Create default option "Go to..." 
      $("<option />", { 
      "selected": "selected", 
      "value" : "", 
      "text" : "Go to..." 
      }).appendTo("nav select"); 

      // Populate dropdown with menu items 
      $("nav a").each(function() { 
      var el = $(this); 
      $("<option />", { 
       "value" : el.attr("href"), 
       "text" : el.text() 
      }).appendTo("nav select"); 
      }); 

      // To make dropdown actually work 
      // To make more unobtrusive: http://css-tricks.com/4064-unobtrusive-page-changer/ 
      $("nav select").change(function() { 
      window.location = $(this).find("option:selected").val(); 
      }); 

     }); 

    if(document.createTouch) { 
     this.addEvent(c[j],'tap',this.tipOver,false); 
    } else { 
     this.addEvent(c[j],'mouseover',this.tipOver,false); 
     this.addEvent(c[j],'mouseout',this.tipOut,false); 
    } 
}); 

Также убедитесь, что вы включили файл jQuery в заголовок темы Wordpress.

+0

Это не сработало. Я даже пытался добавить .container.navigation nav select вместо nav select, но никаких изменений. – Iva

+0

В конце концов, я разделил их все и изменил каждый $ на jquery; поэтому ваш ответ стал хорошим началом для постоянного решения. Благодарю. :) – Iva

Смежные вопросы