2013-02-27 3 views
2

У меня есть это действительно маленький кусочек кода, который я хочу осуществить внутри слова нажмите:Добавить это маленькое действие JQuery в WordPress с помощью кнопки

<div id='cont' style="border: 1px solid #000; height: 150px; overflow:hidden;"> 
    <a href="#" id="button">Mostrar Todo</a> 
    <ul> 
     <li>an item</li> 
     <li>an item</li> 
     <li>an item</li> 
     <li>an item</li> 
     <li>an item</li> 
     <li>an item</li> 
     <li>an item</li> 
     <li>an item</li> 
     <li>an item</li> 
     <li>an item</li> 
     <li>an item</li> 
     <li>an item</li> 
     <li>an item</li> 
     <li>an item</li> 
     <li>an item</li> 
     <li>an item</li> 

    </ul> 
</div>` 

функции JQuery Я хочу сделать

$('#button').click(function(){ 
    $('#cont').animate({height:'500px'}, 500); 

}); 

демо :

http://jsfiddle.net/YPAy6/9/

Я просто необходимо, как и где поставить «функция» и как вызвать ее из сообщения в Wordpress.

Любая идея? Большое спасибо!

PD: Я загружаю все сценарии из cdn google, и насколько я знаю, его не нужно загружать ни один другой jquery cos wordpress при загрузке своей собственной версии, так или иначе я не уверен в этом на 110%.

ответ

1

Для выполнения указанной функции JQuery на вашем WP сайте, вы должны загрузить его через .js файл первый. Скопируйте и сохраните его, скажем, functions.js и поместите его в папку с именем/js/your theme directory (/ wp-content/themes/[theme-name]).

Чтобы загрузить скрипты на ваш сайт, вы можете использовать старый добрый способ <script src="..." /> в элементе <head>, но я настоятельно рекомендую вместо этого использовать wp_enqueue_script. (см. WP codex для получения дополнительной информации).

Добавьте функцию wp_enqueue_scripts() к вашей теме functions.php:

<?php 
function site_functions_js() { 
    wp_enqueue_script(
     'site_functions', 
     get_template_directory_uri() . '/js/functions.js', 
     array('jquery') 
    ); 
} 
add_action('wp_enqueue_scripts', 'site_functions_js'); 
?> 
+0

ОК, все сделано, но ничего не делает, может быть, что-то связанное без конфликтного режима? (Я использовал wp_enqueue) извините, если некоторые вопросы являются настолько базовыми, но это так просто, и я получаю messed -__- – Mark

+0

. Вы должны проверить загрузку страницы с помощью инструментов разработчика в браузере и посмотреть, есть ли файл JS успешно загружен. – Terry

+0

wel wel wel, теперь я тестирую на сайте песочницы, скрипт загружается, а инструменты разработчика говорят, что что-то не так с файлом js, (что, наверняка, я сделал что-то не так) (http://noslan.com/customers/ песочница /? p = 60) предложения? :) – Mark

0

Создайте новый файл javascript и поместите эту функцию в этот файл и поместите этот файл Javascript ПОСЛЕ функции wp_head. Как это: -

<script type="text/javascript" src="<?php bloginfo("template_url"); ?>/js/yourScript.js"> </script> 

Для более подробной информации по этой ссылке: -

http://digwp.com/2009/06/including-jquery-in-wordpress-the-right-way/

+0

это действительно необходимо? Я имею в виду, что это функция jquery, и jquery загружается WP или у меня есть огромный беспорядок в моем сознании? – Mark

+0

Я собираюсь попробовать все равно сейчас – Mark

+0

нормально, так как я могу увидеть, как лучше всего загружать различные сценарии, это скрипты очереди. Ваш ответ кажется легитимным, но не действительным, или я ошибаюсь? – Mark

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