我有9个小图像，当单击它们时，它们会在图像的较大版本中消失。 为什么不能在Browser（FF）中工作）

Question

<style type="text/javascript" src="jquery-1.11.0.min.js"></style>
<style type="text/javascript" src="myCode.js"></style>
</body> //jquery is within my site directory on my desktop


$(document).ready(function(){
//note:
$("#artShow,#changreImage,#clasziImage,#comicImage,#planetImage,#dragonImage,#wineImage,#underwaterImage,#catImage").mouseenter(function(){
$(this).animate({height:"125px",width:"136px"});
    });
$("#artShow,#changreImage,#clasziImage,#comicImage,#planetImage,#dragonImage,#wineImage,#underwaterImage,#catImage").mouseleave(function(){
$(this).animate({height:"118px",width:"129px"});
    });

//note:hover function

//When user clicks on a small image with the prior image hover function, bigger versions on that image should fade in//

$("#big").hide();
    $("#artShow").click(function(){
        $("#big").fadeIn(2000);
            $("#big").click(function(){
                $("#big").fadeOut(2000);
                });

    });

        $("#big2").hide();
    $("#changreImage").click(function(){
        $("#big2").fadeIn(2000);
            $("#big2").click(function(){
                $("#big2").fadeOut(2000);
                });
    });

            $("#big3").hide();
        $("#clasziImage").click(function(){
            $("#big3").fadeIn(2000);
                $("#big3").click(function(){
                    $("#big3").fadeOut(2000);
                });
        });

            $("#big4").hide();
            $("#comicImage").click(function(){
                $("#big4").fadeIn(2000);
                    $("#big4").click(function(){
                        $("#big4").fadeOut(2000);
                    });
                });

                    $("#big5").hide();
                    $("#planetImage").click(function(){
                        $("#big5").fadeIn(2000);
                            $("#big5").click(function(){
                                $("#big5").fadeOut(2000);
                            });
                        });

                            $("#big6").hide();
                            $("#dragonImage").click(function(){
                                $("#big6").fadeIn(2000);
                                    $("#big6").click(function(){
                                        $("#big6").fadeOut(2000);
                                    });
                                });

                                    $("#big7").hide();
                                    $("#wineImage").click(function(){
                                        $("#big7").fadeIn(2000);
                                            $("#big7").click(function(){
                                                $("#big7").fadeOut(2000);
                                            });
                                        });

                                            $("#big8").hide();
                                            $("#underwaterImage").click(function(){
                                                $("#big8").fadeIn(2000);
                                                    $("#big8").click(function(){
                                                        $("#big8").fadeOut(2000);
                                                    });
                                                });

                                                    $("#big9").hide();
                                                    $("#catImage").click(function(){
                                                        $("#big9").fadeIn(2000);
                                                            $("#big9").click(function(){
                                                                $("#big9").fadeOut(2000);
                                                            });
                                                        });

});

Answer 1

<style type="text/javascript" src="jquery-1.11.0.min.js"></style>
<style type="text/javascript" src="myCode.js"></style>

Shouldn't it be:

<script type="text/javascript" src="jquery-1.11.0.min.js"></script>
    <script type="text/javascript" src="myCode.js"></script>

?

Answer 2

tag should be script .

<script type="text/javascript" src="jquery-1.11.0.min.js"></script >
<script type="text/javascript" src="myCode.js"></script>
</body> //jquery is within my site directory on my desktop


$(document).ready(function(){
    //note:
    $(".img")
        .mouseenter(function(){ 
            $(this).animate({height:"125px",width:"136px"});
         })
        .mouseleave(function(){
            $(this).animate({height:"118px",width:"129px"});
         });
});

myCode.js

$(document).ready(function(){

    $(".big-img").hide();
    $(".img").click(function(){
        var id = $(this).data(id);
        $("#"+id)
            .fadeIn(2000)
            .click(function(){
                $(this).fadeOut(2000);
            });

    });

});

HTML image

<img class="img" src="" data-id="artShow">
<img class="big-img" src="" id="artShow" >