This site is using cordillera which calls on /wp-includes/js/jquery/jquery.js?ver=1.11.2
.
The child theme contains a front-page.php which consists of:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title><?php wp_title(); ?></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<?php wp_head(); ?>
<link type="text/css" href="<?php echo get_stylesheet_directory_uri(); ?>/front-page.css" rel="stylesheet" />
</head>
<body bgcolor="#ffffff" <?php body_class($class); ?>>
<div id="front-page">
<img src="<?php echo get_stylesheet_directory_uri(); ?>/images/tempertemper.jpg" alt="Temper Temper entry image" width="1200" height="800" usemap="#Map" title="Temper Temper Fine Chocolates" border="0" />
<map name="Map" id="Map">
<area shape="rect" coords="115,500,637,773" href="http://www.margaretriver.com" alt="Margaret River" />
<area shape="rect" coords="641,240,857,772" href="/test/shop" alt="Visit our online shop" />
<area shape="rect" coords="195,186,366,449" href="/test/gallery" alt="Come see our image gallery" />
<area shape="rect" coords="504,349,622,440" href="/test/contact" />
<area shape="rect" coords="616,124,890,237" href="/test/about-us" alt="About Temper Temper" />
<area shape="rect" coords="985,285,1164,488" href="https://www.facebook.com/tempertempermargaretriver" alt="Follow Temper Temper on Facebook" />
<area shape="rect" coords="859,490,1036,793" href="http://www.tripadvisor.com.au/Restaurant_Review-g255367-d7789880-Reviews-Temper_Temper_Fine_Chocolate-Margaret_River_Margaret_River_Region_Western_Austral.html" alt="See our Reviews on Trip Advisor" />
</map>
<?php wp_nav_menu( array( \'theme_location\' => \'front-page-menu\' ) ); ?>
<p align="center">© Temper Temper 2015</p>
</div>
<?php wp_footer(); ?>
<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/js/jquery.rwdImageMaps.js"></script>
<script>
$(document).ready(function() {
$(\'img[usemap]\').rwdImageMaps();
});
</script>
</body>
</html>
The main image (div#front-page img
) is responsively sized for screen size <= 960px.
I want to make the image map responsive too, by using this project. This project relies on jQuery, but doesn\'t seem to work with jQuery v1.11.2. i.e: Using /wp-includes/js/jquery/jquery.js?ver=1.11.2
the image map is not responsive. It produces a Chrome code inspector console error Uncaught TypeError: undefined is not a function
using jquery.js?ver=1.11.2
So I want to try including jQuery v2, but to do so, I must first disable /wp-includes/js/jquery/jquery.js?ver=1.11.2
from front-page.php.
How do I do this?
SO网友:Charles
也许我是如履薄冰,但让我们试一试
假设您已经下载了正确的jquery版本(要使用),并将其复制到文件夹中
(与jquery.rwdImageMaps.js
符合逻辑(imho)
Imho您还可以删除以下代码部分<script type="text/javascript" src="<?php echo get_stylesheet_directory_uri(); ?>/js/jquery.rwdImageMaps.js"></script>
来自头版。php文件并将其与(\'new\')jQuery一起加载,然后将文件迁移到页脚中
如果不需要,请删除下面的两行//To load the jquery.rwdImageMaps.js file also into the footer
您可以使用以下函数。(我假设您下载了两个文件,一个是普通的jQeury文件,另一个是缩小的jQeury文件),(使用false,true
进入页脚false,false
进入头部)
请在函数中复制此函数。php(在您的子主题文件夹中)
function load_scripts_into_footer() {
// Only load on front-page.php (else it could brake some?)
if ( is_front_page() ){
// Deregister the undesirable jQuery file WP uses itself
wp_deregister_script( \'jquery\' );
// The Version2 jQuery file
wp_register_script( \'jquery-2.0.0.min\', get_stylesheet_directory_uri() . \'/js/jquery-2.0.0.min.js\', array(), false, true );
wp_enqueue_script( \'jquery-2.0.0.min\', get_stylesheet_directory_uri() . \'/js/jquery-2.0.0.min.js\', array(), false, true );
// It is recommend to use jquery-migrate in this case
wp_enqueue_script( \'jquery-migrate.min\', \'/wp-includes/js/jquery/jquery-migrate.min.js\', array(\'jquery-2.0.0.min\'), false, true );
// To load the jquery.rwdImageMaps.js file also into the footer
wp_register_script( \'jquery.rwdImageMaps\', get_stylesheet_directory_uri() . \'/js/jquery.rwdImageMaps\', array(\'jquery-2.0.0.min\',\'jquery-migrate.min\'), false, true );
wp_enqueue_script( \'jquery.rwdImageMaps\', get_stylesheet_directory_uri() . \'/js/jquery.rwdImageMaps\', array(\'jquery-2.0.0.min\',\'jquery-migrate.min\'), false, true );
}
}
// Action hook
add_action( \'wp_enqueue_scripts\', \'load_scripts_into_footer\' );
我还没有测试过它,但它应该可以正常工作。我想说,试试看。
如何使用deregister如何register如何enqueue有关的详细信息jQuery
2.0