سبد (0)

آموزش ساخت آسمان برفی

ایجاد آسمان برفی با استفاده از HTML5 و JavaScript

این پلاگین، با استفاده از HTML5 و JavaScript، بارش برف مجازی را در صفحه وب ایجاد می کند.

WebSnowjq.Js، با تمام مرورگرهایی که HTML5 را پشتیبانی می کنند سازگار است.

DEMO یا پیش نمایش پلاگین WebSnowjq.Js

برای مشاهده نتیجه کار، روی لینک زیر کلیک نمایید:

مراحل انجام کار (ساخت آسمان برفی)

این آموزش شامل 3 قسمت زیر است:

  1. اضافه کردن فایل های لازم برای ایجاد آسمان برفی
  2. تعریف تگ HTML و استفاده از متد ()websnowjq
  3. مشخص کردن تعداد دانه های برف

اضافه کردن فایل های لازم برای ایجاد آسمان برفی

برای استفاده از WebSnowjq.js به مهارت برنامه نویسی خاصی نیاز نیست، فقط کافی است فایل WebSnowjq.Js را به صورت رایگان از انتهای این آموزش دانلود کنید، این فایل، شامل یک فایل جاوا اسکریپت در پروژه شماست که متد ()websnowjq را فراخوانی می کند.

برای استفاده از پلاگین WebSnowjq، ابتدا باید فایل های زیر را به سند خود اضافه کنید:

  1. jquery.min.js
  2. WebSnowjq.js

اضافه  کردن فایل های لازم

<script src="/jquery.min.js"></script>
<script src="/Websnowjq.js"></script>

 تعریف تگ HTML و استفاده از متد ()websnowjq

حتماً قبل از انجام هر کاری فایل های jquery و WebSnowjq.js را به سند HTML خود اضافه کنید:

 

<!DOCTYPE HTML>
<html>
<head>
    <script src="/jquery.min.js"></script>
    <script src="/plugin/Websnowjq.js"></script>    
</head>
<body>
<img src="/images/jQuery/plugin/window.jpg" id="divSnow" width="250" height="187" />
<script>
$(document).ready(function(){
   $("#divSnow").websnowjq();
});
</script>
</body>
</html>              
خودتان امتحان کنید »

مشخص کردن تعداد دانه های برف

تعداد دانه های برف را در بارش می توان با استفاده از پارامتر snowFlakes تعیین کرد:

 تعداد دانه های برف

<!DOCTYPE HTML>
<html>
<head>
    <script src="/jquery.min.js"></script>
    <script src="/plugin/Websnowjq.js"></script>    
</head>
<body>
<img src="/images/jQuery/plugin/window.jpg" id="divSnow" width="250" height="187" />
<script>
$(document).ready(function(){
   $("#divSnow").websnowjq({ snowFlakes: 3 });
});
</script>
</body>
</html>                
خودتان امتحان کنید »

سازگار با تمام ورژن های اصلی مرورگرهایی که HTML5 را پشتیبانی می کنند: اینترنت اکسپلورر 9.0+, گوگل کروم 4.0+, موزیلا فایرفاکسx 2.0+,سافاری 3.1

دانلود فایل های پلاگین WebSnowjq.js

حجم: 1.71 کیلو بایت

نوشته شده توسط شهربانو دوستی
بازدید: 10606

در میان شش هزار مطلب آموزشی منتشر شده در بیاموز، جستجو نمایید ...

تمامی محصولات و خدمات این وبسایت، حسب مورد دارای مجوزهای لازم از مراجع مربوطه می‌باشند و فعالیت‌های این سایت تابع قوانین و مقررات جمهوری اسلامی ایران است.
logo-samandehi مجوز نشر دیجیتال از وزرات فرهنگ و ارشاد اسلامی پرداخت آنلاین - بانک ملت معرفی بیاموز در شبکه سه