Ishni bajarish tartibi:
JavaScript haqida qisqacha nazariy ma’lumot
Ma’lumotlarni kiritish formalarini tekshiruvchi dastur ishlab chiqish
Natijani brauzerda tekshirish
Qisqacha nazariy ma’lumot
Javascript – bu Webni gipermatnli sahifalarini klient tomonida ko’rish tsenariyalarini boshqarish tili. Yanada aniqroq aytadigan bo’lsa, Javascript – bu na faqat klient tomonidagi dasturlash tili. Liveware Javascript tilining avlodi bo’lib, Netscape serveri tomonida ishlovchi vosita bo’ladi. Ammo Javascript tilini mashhur qilgan narsa bu klient tomonida dasturlashdir. Javascriptning asosiy vazifasi – HTML-konteynerlar atributlarining qiymatlarini va ko’rsatuvchi muhitining hossalirini HTML-sarlavxalarni ko’rish jarayonida foydalanuvchi tomonidan o’zgartirish imkoniyatlarida, boshqacha aytganda ularni dinamik sarlavxalar qilish (DHTML). Yana shuni aytish joizki, sarlavxalar qayta yuklanmaydi Amalda buni, masalan, quydagicha ifodalash mumkin, sarlavxaning fonini rangini yoki xujjatdagi rasmni o’zgartirish, yangi oyna ochish yoki ogoxlantirish oynasini chiqarish. “JavaScript” nomi Netscape kompaniyasining hususiy maxsuloti. Microsoft tomonidan amalga oshirilgan til rasman Jscript deb nomlanadi. Jscript versiyalari Javascriptning mos versiyalari bilan mos keladi (aniqroq qilib aytganda oxirigacha emas). Javascript – ECMA (European Computer Manufacturers Association – Evropa Kompyuter Ishlab Chiqaruvchilar Assotsiyatsiyasi) tomonidan standartlashtirilgan. Mos standartlar quydagicha nomlanadi ECMA-262 va ISO-16262. Ushbu standartlar bilan Javascript 1.1ga taqriban ekvivalent ECMAScript tili aniqlanadi. Eslatish joizki, bugungi kunda Javascript ning hamma versiyalari ham ECMA standartlariga mos kelavermaydi. Mazkur kurs yoki qo’llanmada barcha hollarda biz Javascript nomidan foydalanamiz. Javascriptning asosiy hususiyatlari. Javascript – bu Internet uchun katta bo’lmagan klient va server ilovalarni yaratishga mo’ljallangan nisbatan oddiy ob’ektga yo’naltirilgan til. Javascript tilida tuzilgan dasturlar HTML-xujjatning ichiga joylashtirilib ular bilan birga uzatiladi.
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
/* Bordered form */
form {
border: 3px solid #f1f1f1;
}
/* Full-width inputs */
input[type=text], input[type=password] {
width: 100%;
padding: 12px 20px;
margin: 8px 0;
display: inline-block;
border: 1px solid #ccc;
box-sizing: border-box;
}
/* Set a style for all buttons */
button {
background-color: #4CAF50;
color: white;
padding: 14px 20px;
margin: 8px 0;
border: none;
cursor: pointer;
width: 100%;
}
/* Add a hover effect for buttons */
button:hover {
opacity: 0.8;
}
/* Extra style for the cancel button (red) */
.cancelbtn {
width: auto;
padding: 10px 18px;
background-color: #f44336;
}
/* Add padding to containers */
.container {
padding: 16px;
}
/* The "Forgot password" text */
span.psw {
float: right;
padding-top: 16px;
}
/* Change styles for span and cancel button on extra small screens */
@media screen and (max-width: 300px) {
span.psw {
display: block;
float: none;
}
.cancelbtn {
width: 100%;
}
}
</style>
<title></title>
</head>
<body>
<form action="3 lab bootstrap.html">
<div class="container">
<label for="01285"><b>Username</b></label>
<input type="text" placeholder="Enter Username" name="01285" required>
<label for="2017"><b>Password</b></label>
<input type="password" placeholder="Enter Password" name="2017" required>
<button type="submit">Login</button>
<label>
<input type="checkbox" checked="checked" name="remember"> Remember me
</label>
</div>
<script>
// Get the modal
var modal = document.getElementById('id01');
// When the user clicks anywhere outside of the modal, close it
window.onclick = function(event) {
if (event.target == modal) {
modal.style.display = "none";
}
}
</script>
</body>
</html>
NATIJA:
Laboratoriya ishi №7
Mavzu: HTML5 da multimedia imkoiyatlaridan foydalanish
Ishning maqsadi: Brauzer orqali HTML5 ning multimedia imkoniyatlarini ko’rsatish.