I have a mouseover function that should add a class to my viewport element, but i get an error in firebug when I mouseover: TypeError: jQuery(...).addclass is not a function.
the HTML is:
<!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>
The related styles are:
.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;
}
The JS file is:
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);
});
The addClass() method adds one or more class names to the selected elements. This method does not remove existing class attributes, it only adds one or more class names to the class attribute. Tip: To add more than one class, separate the class names with spaces.
Try this :
jQuery('.viewport').addClass('viewporthome');
addClass
need a capital "C".
Also, when adding class, you dont need to put the "." in the string or your class will be ..viewporthome
.
Use addClass
instead of addclass
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With