Wordpress和JS工具提示不起作用

Wordpress and JS Tooltip does not works

本文关键字：不起作用 工具提示 JS Wordpress      更新时间：2023-09-29

我正在使用Wordpress和Bootstrap插件构建这个网站。

如您所见，在底部有一个带内容表的col-md-8，在右侧有一个带有图片的col-md-4。

此图片应为动画工具提示。基本上，当你把鼠标放在桌子row上时，画面应该会改变。我正在使用这个JS <script>，但不起作用：

JS:

$(document).ready(function(){
$('.row1').hover(function() {
  $('.one').toggle();
});
$('.row2').hover(function() {
  $('.two').toggle();
});
$('.row3').hover(function() {
  $('.tree').toggle();
});     
});

这是CSS:

.one, .two, .tree { 
display: none; 
}

.row1:hover {
background-color: #91bd10;
color: #ffffff;
}
.row2:hover {
background-color: #91bd10;
color: #ffffff;
}
.row3:hover {
background-color: #91bd10;
color: #ffffff;
}
.info-box {
width: 400px;
height: 200px;
background-image: url('http://www.jp.nowcommu.myhostpoint.ch/wp-content/uploads/2016/03/base-1.png');
background-size: cover !important;
margin: 0 auto;
}

有什么想法吗？

编辑JS:

if($ == undefined){
 $ = jQuery;
}
$(document).ready(function(){
$('.row1').hover(function() {
  $('.one').toggle();
});
$('.row2').hover(function() {
  $('.two').toggle();
});
$('.row3').hover(function() {
  $('.tree').toggle();
});     
});

编辑2:JS代码

您的JS中有一个错误。检查您的控制台：Uncaught SyntaxError: Unexpected token <

这是您页面中的代码：

 $(document).ready(function(){
    $('.row1').hover(function() {
      $('.one').toggle();
    });</p>
<p>   $('.row2').hover(function() {
      $('.two').toggle();
    });</p>
<p>    $('.row3').hover(function() {
      $('.tree').toggle();
    });

看到那些<p>标签了吗？

我建议你用你的问题中的代码替换你网站中的代码。

在$(document).ready 之前尝试使用以下内容

if($ == undefined){
     $ = jQuery;
}
相关文章：