ترك أحد الأصدقاء رسالة يقول إنه يحتاج إلى رمز محلي لـ JS لتنفيذ القدرة على التكيف على الشاشة. لقد قمت بتجميعها هنا ونشرها للجميع.
نسخة الكود كما يلي:
<! doctype html>
<html>
<head>
<meta charset = "utf-8">
<title> Unted Document </title>
<style>
*{
الهامش: 0 ؛
الحشو: 0 ؛
على غرار القائمة: لا شيء ؛
}
ديف {
الهامش: 0 Auto ؛
الارتفاع: 10000px ؛
Min-Width: 880px ؛
Max-Width: 1100px ؛
الخلفية:#060 ؛
واضح: كلاهما ؛
}
ul {}
لي {
تعويم: اليسار.
العرض: مضمّن ؛
العرض: 198px ؛
الارتفاع: 198px ؛
الحدود: 1px الصلبة #CCC ؛
الهامش: 10px ؛
}
</style>
</head>
<body>
<div id = "main">
<ul>
<li> 1111111111111 </li>
<li> 222222222222 </li>
<li> 33333333333333 </li>
<li> 444444444444 </li>
<li> 555555555555 </li>
<li> 6666666666 </li>
<li> 777777777777777 </li>
<li> 888888888888888 </li>
<li> 9999999999 </li>
<li> 000000000000000 </li>
<li> </li>
<li> </li>
<li> </li>
<li> </li>
<li> </li>
<li> </li>
<li> </li>
<li> </li>
<li> </li>
<li> </li>
<li> </li>
<li> </li>
<li> </li>
<li> </li>
<li> </li>
</ul>
</div>
<script>
فار وينويث ؛
window.onload = function () {
إذا (window.innerwidth)
winwidth = window.innerwidth ؛
آخر إذا ((document.body) && (document.body.clientwidth))
winwidth = document.body.clientwidth ؛
إذا (WinWidth <= 1100)
document.getElementById ("main"). style.width = "880px" ؛
آخر إذا (winwidth> = 1100)
document.getElementById ("main"). style.width = "1100px" ؛
}
window.onresize = function () {
إذا (window.innerwidth)
winwidth = window.innerwidth ؛
آخر إذا ((document.body) && (document.body.clientwidth))
winwidth = document.body.clientwidth ؛
إذا (WinWidth <= 1100)
document.getElementById ("main"). style.width = "880px" ؛
آخر إذا (winwidth> = 1100)
document.getElementById ("main"). style.width = "1100px" ؛
}
</script>
</body>
</html>
لنجربها ، هل التأثير جيد جدًا؟ أتمنى أن يحبها الجميع.