

初めまして。  
コーディング初心者で現在ホームページ作りをしているのですが、  
画像マウスオーバー時に白黒からカラーを切り替えるプラグインのBlackAndWhiteを利用しようとしておりますが、うまくいきません。

念のためマウスオーバー前の画像を添付しておきます。

マウスオーバー前  
[![画像の説明をここに入力](https://i.stack.imgur.com/fBQjC.png)](https://i.stack.imgur.com/fBQjC.png)

このような形でマウスオーバー前はalt属性が左上に謎に表示された状態で、マウスオーバー後は白黒からカラーに変わるような動作はしますが、alt属性が消えるだけになります。画像自体は消えません。

恐縮ではございますが、お詳しい方ご教授いただけませんでしょうか？

[code]

    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="js/jquery.BlackAndWhite.js"></script>
    <script>
    $(function() {
     $('.bwWrapper').BlackAndWhite({
            hoverEffect : true,
            webworkerPath : false,
            invertHoverEffect: false,
            intensity:1,
            speed: {
                fadeIn: 200,
                fadeOut: 800
            },
            onImageReady:function(img) {
            }
        });
    });
    </script>
[/code]

[code]

    #pnav li{
     display: inline-block;
     margin:50px 97px;
     width:300px;
     height:300px;
     text-align: center;
    }
    
    .bwWrapper{
     margin-top: 50px;
     position:relative;
      display: block;
    }
[/code]

[code]

        <nav id="pnav">
          <ul>
            <li><a href="service.html" class="bwWrapper"><img src="img/ser222.jpg" alt="pariss"/></a></li>
            <li><a href="service.html" class="bwWrapper"><img src="img/ser222.jpg" alt="paris"/></a></li>
          </ul>
        </nav>
[/code]

一部抜粋ですが、現在このように記入しております。  
一応jQueryはなんとなく反応はしていてブラウザ上では、alt属性が画像左上に表示されており画像をマウスオーバーするとalt属性が消えるような感じになっております。

恐縮ではございますが、ご教授お願いいたします。


CC BY-SA 3.0
2017-03-09T01:28:32.123
33201
2017-03-09T15:47:43.953
2017-03-09T15:47:43.953
20985
20985
question
javascript jquery css html5
jQuery BlackAndWhiteが利用できない