Postingan lainnya

Kode pada jquery tidak berfungsi seperti pada video tutorial

Saya baru belajar jquery dan mengalami kendala pada tahap tutorial dasar untuk mengambil nilai dimensi. Ketika saya menulis baris kode untuk menampilkan nilai "width" yang semula 100 tanpa ada tambahan padding,margin,border,dll.Setelah saya menambahkan padding,margin,dll tersebut nilainya tetap 100 yang seharusnya 99.9091 pada video tutorial dasar j-query di sekolahkoding. Berikut kodenya dan mohon dikoreksi mana yang salah

<!DOCTYPE html>
<html>
<head>
	<title>Belajar J-Query</title>
	<style>
		#boxesWrap{
			background: blue;
			width: 100px;
			height: 100px;
			padding: 10px;
			border: 5px solid black;
			margin: 10px;
		}

		.change{
			background : yellow;
			color: red;
		}
	</style>

	<script src="jquery.js"></script>
</head>
<body>

	<h1 class="change">Belajar JQuery</h1>

	<div id="box1">box 1</div>
	<div id="boxesWrap">
		<div class="boxes">Baris Pertama</div>
		<div class="boxes">Baris Kedua</div>
		<div class="boxes">Baris dua koma lima</div>
		<div class="boxes">Baris ketiga</div>
	</div>

	<form>
		<input type="text" id="inputText" />
		<input type="submit" />
	</form>

      //------------kode yg ini-----------------------
	<script>
		$(document).ready(function(){
	        //--dimensi---
	        var nilai = $('#boxesWrap').width();
                $('#box1').text(nilai);

		});

	</script>
      //------------kode yg ini-----------------------

</body>
</html>

ini link videonya <a href=' https://sekolahkoding.com/kelas/belajar-jquery-dari-dasar/video/mengambil-nilai-dimensi '> https://sekolahkoding.com/kelas/belajar-jquery-dari-dasar/video/mengambil-nilai-dimensi </a>

jquery

@RenoKurniawan01

1 Kontribusi 0 Poin

Diperbarui 5 tahun yang lalu

Tanggapan

sertakan di atas link video yang dimaksud 2. sertakan kode yang relevan saja, jadi orang gampang bacanya

@hilmanski

Sudah di edit pertanyaan saya mas. Saat saya ganti "width" dengan "outerWidth" hasilnya malah 130 bukan 129 seperti yang di video mas. Itu kenapa ya?

@RenoKurniawan01

2 Jawaban:

script jquery js nya coba make ini <pre> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script> </pre>

@driyan

193 Kontribusi 109 Poin

Dipost 5 tahun yang lalu

Tanggapan

Masih gak bisa gan

@RenoKurniawan01

Jawaban Terpilih

Mengacu ke <a href=' https://api.jquery.com/outerWidth/ '>dokumentasi outerwidth jquery </a>aja mas

Di situ ada contoh gambar: outerWidth: ditambahkan dengan padding dan border kalau outerWidth(true) ditambah margin

Saya kurang tahu kalau masalah angkanya koma koma tidak pas, kalau kamu mau pasin tinggal tambah parseInt untuk mengubahnya ke integer, tidak perlu terlalalu pusing

@hilmanski

2686 Kontribusi 2135 Poin

Dipost 5 tahun yang lalu

Tanggapan

Baiklah.Terimakasih sudah memberi saya saran mas.

@RenoKurniawan01