لرزش عکس و حاشیه با جی کوئری

لرزش با حاشیه

شروع سریع

1.- فایل های زیر رو در قالب بزارید

    <!-- Bootstrap and JQuery -->
    <link rel="stylesheet" href="bootstrap.min.css">
    <script src="jquery.min.js"> </script>
        
    <!-- Plugin -->
    <link rel="stylesheet" href="ShakeBorder.css">
    <script src="ShakeBorder.js"></script>

2.- قسمت اچ تی ام ال را بسازید و در جای مناسب قرار بدید

   <img class="ShakeAndBorder" alt="Cubexy.js"  src="img/jquery-html5-avtargenerator-Cubexy.png" />



<img class="ShakeAndBorder" alt="SimpleCalculadora" src="img/jquery-bootstrap-calculator.png" />



<img class="ShakeAndBorder" alt="3dCover" src="img/jquery-css3-cover3d.jpg" />
             

3.- حالا با استفاده از کد جی کوئری زیر افکت را صدا کنید

                 $('.ShakeAndBorder').ShakeBorder();
               

4.- پایان کار و لذت از افکت !

تنظیمات

شما می توانید تنظیمات را اختصاصی کنید وقتی شما می خواهید از پلاگین یا کد جی کوئری استفاده کنید می توانید از گزینه های زیر استفاده کنید

        $('.ShakeAndBorder').ShakeBorder({
                    option: value,
                    option2: value2
       });
                 
               

پیشنمایش (با تنظیمات صورت گرفته)

        { 
        shake:true, /* enabled shake  effect */
        border:true /* enabled border effect*/
        }
           

---

        $('.NoBorder').ShakeBorder({ shake: false });
                 
               

---

        $('.Noshake').ShakeBorder({ border: false });