我需要帮助,使我的标志和社会图标nopin悬停

I need help making my Logo and Social Icons nopin on hover

本文关键字:社会 图标 nopin 悬停 标志 我的 帮助      更新时间:2023-09-26

我需要从每个图像中删除我的pinit按钮的悬停效果。我想从社交图标和标志图像中删除悬停字体选项。我的社交图标有一个悬停效果,我想保持。我在www.latulipefloraldesigns.com/blog3.html有一个测试页面…任何帮助都是感激的!

HTML . .在

的正上方
  <script type="text/javascript"  src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
  <script type="text/javascript" src="js/jquery.pinit.js"></script>
   <script type="text/javascript">
   $(function () {
  $('img').pinit();
    });
    </script> 

这是我的style.css

中的CSS
   .pinit .pinit-overlay {
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
z-index:200;
display:none;
background:transparent url('../images/hover-1.png') repeat 0 0;
text-align:center;
     }
      /* button style, and center it */
      .pinit .pinit-overlay a {
position:relative;
top:45%;
left:45%;
margin:-10px 0 0 -21px;
display:block;
width:100px;
height:100px;
background:transparent url('../img/pinit-button.png') no-repeat 0 0;
text-indent:-9999em;
        }
        .pinit .pinit-overlay a:hover {
background-positon: 0 -100px;
       }
        .pinit .pinit-overlay a:active {
 background-position: 0 -100px;
       }

jQuery在它自己的文件中

    (function($){
//Attach this new method to jQuery
$.fn.extend({ 
    pinit: function(options) {
        var defaults = {
            wrap: '<span class="pinit"/>',
            pageURL: document.URL
        }       
        var options = $.extend(defaults, options);
        var o = options; 
        //Iterate over the current set of matched elements
        return this.each(function() {
            var e = $(this),
                pi_media = e.data('media') ? e.data('media') : e[0].src,
                pi_url = o.pageURL,
                pi_desc = e.attr('title') ? e.attr('title') : e.attr('alt'),
                pi_isvideo = 'false';
                 bookmark = 'http://pinterest.com/pin/create/bookmarklet/?media=' +             encodeURI    (pi_media) + '&url=' + encodeURI(pi_url) + '&is_video=' + encodeURI (pi_isvideo) + '&description=' + encodeURI(pi_desc);
            var eHeight = e.outerHeight();              
                e.wrap(o.wrap);
                e.after('<span class="pinit-overlay" style="height: ' + eHeight + 'px"><a      href="' + bookmark + '" class="pinit-button">Pin It</a></span>');
            $('.pinit .pinit-button').on('click', function () {             
                window.open($(this).attr      ('href'), 'Pinterest', 'width=632,height=253,status=0,toolbar=0,menubar=0,location=1,scrollbars=1');              
                return false;
            });     
            $('.pinit').mouseenter(function () {
                $(this).children('.pinit-overlay').fadeIn(200);
            }).mouseleave(function () {
                $(this).children('.pinit-overlay').fadeOut(200);
            });

        });
    }
});
  })(jQuery);

在HTML脚本中,只需像这样定位它:

$('#content img').pinit();

那么它将只针对您的content ID.内的项目,它不会针对位于您的页眉或页脚(即。社交媒体图标)。