jquery删除附加的样式标记

时间:2013-12-06 19:40:36

标签: javascript jquery

我有一个代码,在div悬停时将样式添加到头部,但是当我将鼠标悬停在外时,我想破坏之前附加的样式标记,这可能吗?这是我的代码......

jQuery( "#diamonds div" ).hover(
  function() {
    jQuery(this).find('img.label').fadeTo( "fast", 0 );
    jQuery(this).find('.dj-social').delay(200).fadeTo( "fast", 1 );

    var className = jQuery(this).attr('class').split(' ')[1];
    jQuery('head').append('<style>.'+ className +':before {background-size:120% auto !important;}</style>');

  }, function() {
    jQuery(this).find('.dj-social').fadeTo( "fast", 0 );
    jQuery(this).find('img.label').delay(200).fadeTo( "fast", 1 );

    var className = jQuery(this).attr('class').split(' ')[1];

        // ----This is where I want to destroy the style tag i have just inserted   
        jQuery('head').remove('<style>.'+ className +':before {background-size:100% auto !important;}</style>');

  }
);

继承我的小提琴:http://jsfiddle.net/XwdkC/1/

2 个答案:

答案 0 :(得分:1)

使用jQuery Hover切换:

$(element).hover(function() {
    $(this).addClass('yourStyle');
}, function() {
    $(this).removeClass('yourStyle');
});

答案 1 :(得分:1)

使用类而不是修改内联样式。这样你就可以使用jQuery的addClass()removeClass()函数。