AddclassはjQueryの関数ではありません

私はビューポート要素にクラスを追加する必要があるmouseover関数を持っていますが、マウスオーバー時にFirebugでエラーが発生します：TypeError：jQuery（...）。addclassは関数ではありません。AddclassはjQueryの関数ではありません

HTMLは次のとおりです。

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="<?php bloginfo('charset'); ?>" /> 
<title><?php wp_title('|','true','right'); ?><?php bloginfo('name'); ?></title> 
<meta name="viewport" content="width=device-width" /> 
<link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo('stylesheet_url' ); ?>" /> 
<?php wp_head(); ?> 
</head> 
<body <?php body_class($class); ?>> 
<header> 
<div class="main-logo"> 
    <div id="site-title"> 

    </div><!--.site-title--> 
</div><!--main-logo--> 

<div class="header-right"> 
</div><!--header-right--> 
</header> 

<nav class="main"> 
<?php wp_nav_menu(array('theme_location' => 'main-menu')); ?> 
</nav> 

<div class="viewport"> 
<script type="text/javascript"><!--//--><![CDATA[//><!-- 
jQuery(document).ready(function(jQuery){ 
jQuery('nav .home a').mouseover(function() 
    { 
    jQuery('.viewport').addclass('.viewporthome'); 
    }); 
}); 
//--><!]]></script> 
</div> 
</div>

関連スタイルは、次のとおりです。

.viewport 
    { 
height: 400px; 
width: 400px; 
position: relative; 
top: -90px; 
margin: 0 auto; 

} 

.viewporthome 
{ 
background-image: url('images/Screen2.png'); 
background-repeat: no-repeat; 
background-position: center; 
background-attachment: relative; 

}

JSファイルは次のとおりです。

 var hoverhome = 'url("images/Screen2.png")'; 
    var empty = ''; 
    var success = 'SUCCESS!'; 
    //home 
    jQuery('nav .home a').hover(function() 
    { 
    jQuery('.viewport').css('background-image', hoverhome); 

    }); 
    jQuery('nav .home a').mouseout(function() 
    {  
     jQuery('.viewport').css('background-image', empty); 
    });

出典

2013-05-31 Chris

これを試してみてください：

jQuery('.viewport').addClass('viewporthome');

addClassが資本 "C" が必要です。

また、クラスを追加するときに、 "。"文字列またはクラスには..viewporthomeとなります。

出典

2013-05-31 20:33:38

大成功です！ "また、クラスを追加するときに、"。 "を文字列に入れる必要はありません。そうしないと、クラスが..viewporthomeになります。"完璧に動作します、ありがとう。 – Chris

利用addClass代わりのaddclass

出典

2013-05-31 20:26:59

Javascriptを非常に、非常に、非常に大文字と小文字を区別し – PitaJ

はありません、それだけで、大文字と小文字が区別されている:) –

の仕事をしてくれました、ありがとうございました。そのクラスを追加する必要があるので、なぜバックグラウンドイメージが表示されないのか分かりますか？ – Chris

）余分なドットを削除し、（addclassないaddClass()を使用

jQuery('.viewport').addClass('viewporthome');

出典

2013-05-31 20:27:16

これはエラーを削除しましたが、画像はまだ表示されません – Chris

元の画像と同じ質問ですか？ –

オリジナルのものが何であるか分かりませんが、このコードでは、ホームボタンをマウスオーバーすると、追加されたクラスによってScreen2イメージがビューポートdivに表示されます。 – Chris

あなたの総額を確認してください。 addClassメソッドには大文字の 'C'があります。

jQuery addClass Method

画像はまだ表示されない場合、それはおそらくあなたのイメージへの相対パスの問題です。画像フォルダがJavascriptファイルと同じディレクトリにない場合は、パスを変更する必要があります。私はあなたのディレクトリ構造を知らないと、あなたがする必要があることを正確に伝えることはできません。

出典

2013-05-31 20:30:10

構造：C：/ wamp/www/sitename/wordpress /wp-content/themes/mytheme/images/Screen2.png – Chris

クラスの追加：クラスを削除

$(".something").click(function(){ 
    $(this).addClass("style"); 
});

：

$(".something").click(function(){ 
    $(this).removeClass("style"); 
});

出典

2013-05-31 22:16:25

'$（this）.addClass（ 'class-name'）'を使って 'this.addClass（ 'class-name'）;を試してみたときに問題がありました。 –

AddclassはjQueryの関数ではありません

答えて

関連する問題