Add Remove CSS on hover

by aaronk85

HTML

<div id="elite-nav">
<iframe id="iframeID" width='996' frameborder='0' scrolling='no' src='http://www.dandenongbasketball.com.au/index.php?id=98' allowtransparency="true" style="z-index: 0; height: 35px; position: relative;"></iframe>
</div>

CSS

#elite-nav {
  height: 100%;
  position: absolute;
  width: 100%;
}

JavaScript

var eliteframe = {
    'height': 35,
    'position': 'relative'
    };

var elitehover = {
    'height': 440,
    //'z-index': '-1',
    'position': 'relative'
    };
$(document).ready(function(){
$("#elite-nav iframe").hover(
function(){
   $(this).css(elitehover);
},
function() {
  $(this).css(eliteframe);
})
});

var $spans = $('.last-nav-item');
  $("#iframeID").contents().find( $spans ).css('color','red');