شاید شما هم در برحی از وب سایت های خارجی و یا ایرانی دیده باشید که به جای درج عکس و یا رنگ در پس زمینه وب سایت , از یک ویدئو استفاده میکنند .
طبیعتا این کار به دلیل حجم بالای فیلم ها پیشنهاد نمیشود . اما میتونید از یک تکه فیلم قابل تکرار استفاده نمایید که هم دارای حجم کمتری خواهد بود و هم ما رو به هدفمان خواهند رساند .
برای این ساعت از سایت بیست اسکریپت قصد دارم آموزش این کار را در اختیار شما عزیزان قرار دهم .
و اما آموزش :
برای این کار ابتدا باید کد زیر را در تگ داخل تگ body قرار دهید . (ترجیحا در ابتدای تگ باز شونده body )
<video autoplay loop id="vmsVideo"> <source src="آدرس فیلم.mp4" type="video/mp4"> </video>
توجه : حتما باید فیلم با پسوند mp4 باشد . ( به دلیل پشتیبانی تمامی مرورگر ها از این پسوند )
حال میبایست کد زیر را در css خود قرار دهید
video#vmsVideo { position: fixed; top: 50%; left: 50%; min-width: 100%; min-height: 100%; width: auto; height: auto; z-index: -100; -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); }
در باکس دانلود می توانید هم دمو را دریافت کنید و هم آن را به صورت آنلاین مشاهده فرمایید.
- دانلود حجم 594 کیلوبایت
- پیش نمایشپیش نمایش آنلاین
- مشکلی دارید؟ جواب خود را در پست فروم بگیرید
- منبع : اسکریپت دات کام لطفا رعایت کنید
