-
Notifications
You must be signed in to change notification settings - Fork 0
/
31-temel-otomatik-boyutlandirma-teknik2.htm
84 lines (60 loc) · 3.24 KB
/
31-temel-otomatik-boyutlandirma-teknik2.htm
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
<!DOCTYPE html>
<html>
<head>
<title>Temel Otomatik Boyutlandırma</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- LIBRARY FILES -->
<link rel="stylesheet" type="text/css" href="basic/basic.min.css">
<script src="basic/basic.min.js" type="text/javascript" charset="utf-8"></script>
<script>
/*
- Etiket (Label) nesnesinin yüksekliği "auto" olarak belirlendiğinde,
boyutun tarayıcı tarafından hesaplanması bir zaman alıyor.
- Bu örnekte, nesneye metin eklendikten sonra,
nesnenin hesaplanmış yüksekliğinin nasıl kullanılabileceği gösterilmiştir.
*/
// DEĞİŞKENLER
var articleList = [
"Integer at risus in ligula pharetra finibus. Suspendisse et magna convallis, aliquam ex sed, facilisis turpis. Ut commodo urna purus, vitae scelerisque nibh volutpat nec.",
"Vestibulum tempus ornare tellus, lobortis laoreet augue. Suspendisse malesuada ullamcorper sapien, a lacinia eros ornare vel. Praesent lacinia nisl sed lorem sollicitudin, vel rutrum est sagittis.",
"Nulla accumsan ex urna, id rutrum libero finibus sit amet.",
"Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Cras molestie dui nisi, ac rutrum leo venenatis ac. Maecenas cursus tincidunt nisi quis pellentesque. Vivamus id massa metus. Etiam semper erat quis dolor tristique, non molestie ante mollis.",
"Fusce dignissim.",
"Aenean",
"Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.",
"Maecenas commodo varius metus a fermentum."
]
// İlk sayfa
var a0
// İlk çalışan fonksiyon.
var start = function() {
// NESNE: Sayfanın taşıyıcısı
a0 = createBox(0, 0, page.width, page.height)
a0.scrollY = 1
// Biraz yazı oluştur.
for (var i = 0; i < 10; i++) {
// Yazıyı, a0 nesnesinin içinde, arti0 isminde oluştur. Diğerleri arti1, arti2, arti3 ...
// NESNE: Yazılardan biri
a0["lblArticle" + i] = createLabel(0, 0, 250, "auto")
a0.add(that)
that.color = "lightgray"
that.fontSize = 20
that.space = 10
that.round = 8
// Rasgele bir metin aktar.
that.text = articleList[random(0, articleList.length - 1)]
// Koordinat sistemini devre dışı bırak:
that.element.style.position = "relative"
// NOT: Nesneler, kendi alanlarını korur. Üst üste gelemez.
// Nesnenin dışına doğru boşluk bırak.
that.element.style.marginBottom = "5px"
that.element.style.marginLeft = "20px"
}
}
</script>
</head>
<body>
<!-- HTML content -->
</body>
</html>