wake-up-neo.com

Addclass ist keine Funktion in jQuery

Ich habe eine Mouseover-Funktion, die meinem Viewport-Element eine Klasse hinzufügen sollte, aber ich bekomme einen Fehler in Firebug, wenn ich mit der Maus übergebe: TypeError: jQuery (...). Addclass ist keine Funktion.

das HTML ist: 

<!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>

Die verwandten Stile sind:

    .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;

}

Die JS-Datei lautet:

      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);
  });
javascriptjqueryhtmlcsswordpress
7
Chris

Versuche dies :

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

addClass benötigt ein "C".

Wenn Sie eine Klasse hinzufügen, müssen Sie nicht das "." In der Zeichenfolge oder Ihrer Klasse wird ..viewporthome angezeigt.

15
Karl-André Gagnon

Verwenden Sie addClass anstelle von addclass

5
Claudio Redi

Klasse hinzufügen:

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

Klasse entfernen:

$(".something").click(function(){
    $(this).removeClass("style");
});
2
Amir Mehdi Delta

Entfernen Sie den zusätzlichen Punkt und verwenden Sie addClass() nicht addclass ().

jQuery('.viewport').addClass('viewporthome');
1
A. Wolff

Überprüfen Sie Ihre Großschreibung. Die addClass-Methode hat ein 'C'.

jQuery addClass-Methode

Wenn das Bild immer noch nicht angezeigt wird, liegt möglicherweise ein Problem mit dem relativen Pfad zu Ihrem Bild vor. Wenn sich der Bilderordner nicht im selben Verzeichnis wie Ihre Javascript-Datei befindet, müssen Sie möglicherweise den Pfad ändern. Ich kann nicht genau sagen, was Sie tun müssen, ohne Ihre Verzeichnisstruktur zu kennen.

0
DRock Miller