Question

我正在尝试创建图像地图工具提示，图像地图可以像fiddle一样正常工作。

但是，当我尝试在wordpress中实现以下代码时，页面不会加载。

请帮助：

代码：

 <script type="text/javascript" src="js/mytooltip.js"></script>


<div id="wrapper">
   <img width="920" height="450" src="http://www.red-team-design.com/wp-content/uploads/2011/10/world-map.jpg" alt="World continents">

<div class="pin pin-down" data-xpos="170" data-ypos="100">    
  <h2>North America</h2>      
  <ul>
    <li><b>Area (km�):</b> 24,490,000</li>
    <li><b>Population:</b> 528,720,588</li>

  </ul>
</div>

<div class="pin" data-xpos="270" data-ypos="320">     
  <h2>South America</h2>      
  <ul>
    <li><b>Area (km�):</b> 17,840,000</li>
    <li><b>Population:</b> 382,000,000</li>

  </ul> 
</div>

<div class="pin pin-down" data-xpos="450" data-ypos="110">    
  <h2>Europe</h2>     
  <ul>
    <li><b>Area (km�):</b> 10,180,000</li>
    <li><b>Population:</b> 731,000,000 </li>

  </ul>
</div>

<div class="pin" data-xpos="450" data-ypos="250">     
  <h2>Africa</h2>     
  <ul>
    <li><b>Area (km�):</b> 30,370,000</li>
    <li><b>Population:</b> 1,022,011,000</li>

  </ul> 
</div>

<div class="pin pin-down" data-xpos="650" data-ypos="130">    
  <h2>Asia</h2>   
  <ul>
    <li><b>Area (km�):</b> 43,820,000</li>
    <li><b>Population:</b> 3,879,000,000</li>

  </ul>
</div>

  <div class="pin pin-down" data-xpos="750" data-ypos="310">      
  <h2>Australia</h2>      
  <ul>
    <li><b>Area (km�):</b> 9,008,500</li>
    <li><b>Population:</b> 31,260,000</li>

  </ul> 
 </div>

</div>

Answer 1

确保您在jQuery代码之前正确加载了jQuery：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

除此之外，jQuery和Wordpress之间可能存在冲突，请尝试使用以下方法解决：

jQuery(document).ready(function($){
    // Your code here
});

JQuery工具提示无法在wordpress中工作

1 个答案: