Postingan lainnya
Buku Ini Koding!
Baru!
Buku ini akan jadi teman perjalanan kamu belajar sampai dapat kerjaan di dunia programming!
Kelas Premium!
Belajar Javascript untuk website
Gunakan kupon "mulaijs" untuk diskon 75 ribu!
Kesalahan penulisan saya dimana yah.?
saya sedang mempelajari di bagian ini : http://www.sekolahkoding.com/kelas/video/Menambahkan-javascript-pada-website tapi scroll bagian kebawahnya ga mau jalan, kira" kesalahan penulisan saya dimana yah.? terimakasih.
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="style.css">
<link href='https://fonts.googleapis.com/css?family=PT+Serif' rel='stylesheet' type='text/css'>
<title>TEST TEMOLETE</title>
</head>
<body>
<div id="pertama">
<div class="header">
<img src="img/logo.jpg" id="logo">
<div id="menu">
<div class="konten">
<a href="#pertama" class="kolom_3">Home</a>
<a href="#kedua" class="kolom_3 kolom_3_tengah" onclick="return smoothScroll('kedua')">Karya Saya</a>
<a href="#ketiga" class="kolom_3" onclick="return smoothScroll('ketiga')">Kontak</a>
</div>
</div>
</div>
<div class="clear"></div>
<div class="konten">
<div id="box_sd">
<h1>Selamat Datang<br>Di SekolahKoding</h1>
<a href="#kedua">Lihat Karya</a>
</div>
</div>
</div>
<div id="kedua">
<div class="konten">
<h2>Karya Saya</h2>
<div class="kolom_3">
<a href="setiap_folio.html">
<div class="setiap_karya_gambar">
<img src="img/logo.jpg">
<p>Judul Karya</p>
</div>
</a>
<a class="deskripsi">ini adalah description dari setiap keterangan produk.</a>
</div>
<div class="kolom_3 kolom_3_tengah">
<a href="setiap_folio.html">
<div class="setiap_karya_gambar">
<img src="img/logo.jpg">
<p>Judul Karya</p>
</div>
</a>
<a class="deskripsi">ini adalah description dari setiap keterangan produk.</a>
</div>
<div class="kolom_3">
<a href="setiap_folio.html">
<div class="setiap_karya_gambar">
<img src="img/logo.jpg">
<p>Judul Karya</p>
</div>
</a>
<a class="deskripsi">ini adalah description dari setiap keterangan produk.</a>
</div>
<div class="clear"></div>
</div>
</div>
<div id="ketiga">
<div class="konten">
<h2>Kontak Saya</h2>
<div class="kolom_2">
<form action="">
<input type="text" name="nama" placeholder="Insert Nama Anda">
<input type="email" name="email" placeholder="Insert Email Anda">
<textarea name="pesan" placeholder="Insert Pesan Anda"></textarea>
<input type="submit" name="submit" value="Kirim">
</form>
</div>
</div>
<div class="kolom_2">
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d63463.686140556056!2d106.40185809948136!3d-6.200178900892623!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x2e4203d9c7d37567%3A0xb5213d24b036bbc2!2sBalaraja%2C+Tangerang%2C+Banten%2C+Indonesien!5e0!3m2!1sde!2sde!4v1454999329562" width="600" height="250" frameborder="0" style="border:0" allowfullscreen></iframe>
</div>
<div class="clear"></div>
</div>
<div id="footer">
<p> © SekolahKoding</p>
</div>
<script src="folio.js"></script>
</body>
</html>
//FOLIO.JS NYA
var posY = 0;
var jarak = 20;
function smoothScroll(id){
var target = documen.getElementById(id).offsetTop; // Jarak Antara Atas Dan Div
var scrollAnimate = setTimeout(function(){
smoothScroll(id);
}, 5) //fungsi waktu
posY = posY + jarak;
//berhenti pada bagian tertentu
if(posY >= target){
clearTimeout(scrollAnimate);
posY = 0;
}else{
window.scroll(0, posY) // x dan y
}
return false;
}
1
3 Jawaban:
ane rasa ada salah typo/penulisan di bagian folio.js gan berikut versi saya
var posY = 0;
var jarak = 20;
function smoothScroll(id) {
// Jarak Antara Atas Dan Div -- yg agan tulis disini documen
var target = document.getElementById(id).offsetTop;
var scrollAnimate = setTimeout( function() { smoothScroll(id); }, 5); //fungsi waktu
posY = posY + jarak; //berhenti pada bagian tertentu
if(posY >= target) {
clearTimeout(scrollAnimate);
posY = 0;
} else {
window.scroll(0, posY); // x dan y
}
return false;
}
semoga bisa membantu ;)
1
Itu yg di file.jsnya, Gan. Kurang teliti. var target = documen.getElementById(id).offsetTop; // Jarak Antara Atas Dan Div
//document-nya kurang "t".
1
