نوشته شده توسط
moustafa
دست شما درد نکنه از این همه حوصله ومرام
ممنون از لطف شما
واگه بخوایم فیت WebBrowser بشه چطور ؟
در html چند راه برای تعیین اندازه ها داریم:
- اندازه گیری مطلق مانند پیکسل px ، سانتیمتر cm ، میلیمتر mm ، ...
- اندازه گیری نسبی که براساس درسد % بیان میشه و میتونه نسبت به ابعاد المان parent ، المان root ، اندازه فونت، ابعاد viewport و ... باشه.
در همین فایل pager.html اگر دقت کنین یک کانتینر اصلی داریم که id اون data هست و همه المانها درون اون هستن
<div id='data'>
داخل data تعدادی کانتینر دیگه داریم (هر کدام برای یک page از pager) که پشت سر هم چیده شدن
ولی هر بار فقط یکی نشون داده میشه - به جز زمان عوض شدن صفحه و اجرای افکت ها
و داخل هر کدون از این کانتینرها یک جدول table برای نمایش دیتا هر page داریم که تم اون رو با یک کلاس class تعریف کردیم
<div id='page_1' class='page visible Fade_in'>
<table class='black'>
...
</table>
</div>
<div id='page_2' class='page hidden Fade_out'>
<table class='blue'>
...
</table>
</div>
حالا برای دیدن چگونگی تعیین اندازه ها در فایل styles.css دقت کنین:
#data {
position: relative;
margin-top: 1%;
margin-left: 1%;
margin-right: 1%;
width: 98%;
height:90vh;
overflow:hidden;
}
یعنی که پهنای اون 98% برابر پهنای parent element (که میشه body) هست،
و 1% از چپ و راست margin داره (که میشه وسط-چین)،
و 1% از بالا margin داره که چون موقعیتش نسبی تعریف شده (position:relative) یعنی 1% از المان خواهرش (قبلی که میشه کانتینر progress)
و قدش هم 90% قد viewport هست.
یعنی وقتی شما اندازه مرورگر رو تغییر میدین،
پهنای کانتینر data همیشه به صورت خودکار 98% پهنای body
و قدش همیشه 90% قد viewport تنظیم میشه.
و برای هر page :
.page {
transition: ease-in-out all 1s;
position: absolute;
width: 100%;
display: table-row;
box-shadow: rgba(0, 0, 0, 0.7) 0px 5px 15px;
}
پهنای اون همیشه 100% پهنای data هست
و برای هر table
table.green, table.blue, table.orange, table.black {
font-family: Tahoma;
font-size:small;
text-align: center;
border-collapse: collapse;
width: 100%;
height: 100%;
background-color: ghostwhite;
}
همیشه اندازه اش به صورت خودکار تمام فضای در دسترس page رو پر میکنه (100%)
یا در مورد کانتینر clock که همیشه گوشه پایین دست راست قرار میگیره:
#clock {
position: fixed;
bottom: 1%;
right: 1%;
direction: rtl;
font-family: 'Courier New';
font-size: large;
font-weight: bold;
padding: 4px;
border-radius: 6px;
color: gold;
box-shadow: rgba(0, 0, 0, 0.25) 0px 14px 28px, rgba(0, 0, 0, 0.22) 0px 10px 10px;
}
با تعیین right و bottom به اندازه 1% از body انجام میشه،
و چون position اون fixed هست اگر قد مرورگر کافی نباشه میفته روی بخش های دیگه
میشه ازش ایده گرفت برای گزارش سازی کدهای css و html5و js با کدهای vbaدست کاری بشن
دقیقا هدف از این گفتگو هم همین بوده.
شما میتونین هر گزارشی رو که در اکسس ساختنش نشدنی هست رو با این روش بسازین.
در واقع کارهای بیشتری هم میتونین انجام بدین.
اینگونه نیست که فقط برای خروجی (گزارش سازی) استفاده بشه،
میتونین با کنترل مرورگر تعامل دو طرفه داشته باشین و فرم هم بسازین.
این فرم میتونه یک فرم unbound باشه مثل فرم login یا data entry ،
و با صرف وقت و حوصله و کدنویسی حتی میشه از نظر کار مثل فرم Bound باشه.
آموزش ساخت فرم unbound با کنترل وب بروزر و نحوه کار با رخدادهای این کنترل رو در برنامه دارم.
پاسخ با نقل قول