آدرس : تهران ، خیابان آزادی ، خیابان رودکی شمالی ، پلاک ۸۷۰
تلفن ثابت : 02166421387
تلفن همراه : 09198661229
تلفن همراه : 09302974451
ایمیل : info@woham.com
مشاهده تمام صفحه وب با استفاده از jQuery ، نمایش فول اسکرین صفحه نمایش وبسایت با استفاده از کدنویسی کتابخانه جاوا اسکریپت … در این آموزش به شما نشان خواهیم داد که چگونه با استفاده از jQuery صفحه وب را به صورت تمام صفحه مشاهده کنید. حال اگر می خواهید وب سایت شما همیشه در حالت تمام صفحه در مرورگر باز شود، می توانید از این روش استفاده کنید و همچنین با مرورگرهای مختلف سازگار است.
برای مشاهده صفحه وب به صورت تمام صفحه تنها یک مرحله طول می کشد:
یک فایل HTML بسازید و نشانه گذاری، اسکریپت و استایل را تعریف کنید.
مرحله 1. یک فایل HTML بسازید و نشانه گذاری، اسکریپت و استایل را تعریف کنید
یک فایل HTML می سازیم و با نام fullscreen.html ذخیره می کنیم
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".fullscreen_button").on("click", function()
{
document.fullScreenElement && null !== document.fullScreenElement || !document.mozFullScreen && !document.webkitIsFullScreen ? document.documentElement.requestFullScreen ? document.documentElement.requestFullScreen() : document.documentElement.mozRequestFullScreen ? document.documentElement.mozRequestFullScreen() : document.documentElement.webkitRequestFullScreen && document.documentElement.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT) : document.cancelFullScreen ? document.cancelFullScreen() : document.mozCancelFullScreen ? document.mozCancelFullScreen() : document.webkitCancelFullScreen && document.webkitCancelFullScreen()
});
});
</script>
<style>
body
{
text-align:center;
width:100%;
margin:0 auto;
padding:0px;
font-family: "Myriad Pro","Helvetica Neue",Helvetica,Arial,Sans-Serif;
background-color:#819FF7;
}
#wrapper
{
margin:0 auto;
padding:0px;
text-align:center;
width:995px;
}
#wrapper .fullscreen_button
{
background:none;
border:2px solid #585858;
color:#585858;
width:200px;
height:40px;
font-weight:bold;
}
</style>
</head>
<body>
<div id="wrapper">
<input type="button" class="fullscreen_button" value="VIEW FULLSCREEN">
</div>
</body>
</html>
در این مرحله یک دکمه برای تغییر حالت تمام صفحه ایجاد می کنیم و از تابع document.ready برای اجرای کد jQuery استفاده می کنیم تا وقتی دکمه ها کلیک می کنند تمام صفحه را تغییر دهیم.
تمام اینها، این نحوه مشاهده تمام صفحه وب با استفاده از jQuery است. شما می توانید این کد را بر اساس نیاز خود بیشتر سفارشی کنید. و لطفاً نظرات خود را در مورد این آموزش بیان کنید.