Javascript 如何创建一个jquery插件，在页面上显示给定数量的框，并在鼠标上方突出显示框

如何创建一个jquery插件，在页面上显示给定数量的框，并在鼠标上方突出显示框。 当用户单击框时，它会将框从原来的位置移除，并以较大的尺寸显示在页面中心。 如果用户再次单击该框，它将返回其原始位置。

---

要显示的框的数量是可配置的。

为所有框指定一个具有相同名称的类，例如

<div class='box'></div>

---

发布您尝试过的代码..开始时我有点困惑，因为我在JSFIDLE中尝试了几个示例，但没有成功。

$(document).ready(function(){
    $('.box').click(function(){
        $(this).css({'position':'fixed','width':'400px','height':'300px'});
    });

    $('.box').hover(function(){
        $(this).css('background-color','red');
    });

});