Why This HTML Code Deoesn't Work Properly

  • Resolved batamdine

    (@batamdine)


    11 years, 8 months ago

    Hello!

    Please help me, I tried to code this myself.

    <html>
	<head>
		<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Roboto">
		<style>
			body {
				font-family: 'Roboto', serif;
				font-size: 16px;
				 }
		</style>
	</head>

	<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Lobster">
	<div style="font-family: 'Lobster', cursive; font-size: 32px;">Find Restaurant Nearest Your Hotel</div>

	<body>
		<div>
			Choose Your Hotel:
			<script>
				function changeDivDisplay(id)
				{
					if(id == "")
					return;
					div1 = document.getElementById("text1");
					div2 = document.getElementById("text2");
					div3 = document.getElementById("text3");
					div4 = document.getElementById("text4");

					if(id == "1")
						{
							div1.style.display = "block";
							div2.style.display = "none";
							div3.style.display = "none";
							div4.style.display = "none";
						}
					else if(id == "2")
						{
							div1.style.display = "none";
							div2.style.display = "block";
							div3.style.display = "none";
							div4.style.display = "none";
						}
					else if(id == "3")
						{
							div1.style.display = "none";
							div2.style.display = "none";
							div3.style.display = "block";
							div4.style.display = "none";
						}
					else if(id == "4")
						{
							div1.style.display = "none";
							div2.style.display = "none";
							div3.style.display = "none";
							div4.style.display = "block";
						}
				}
			</script>

			<select onchange="changeDivDisplay(this.value)">
				<option value="1">Choose Your Hotel</option>
				<option value="2">i Hotel</option>
				<option value="3">Pacific Palace Hotel</option>
				<option value="4">Batam Centre Hotel</option>
			</select>

			<span id="text1" style="display:block;"></span>

			<span id="text2" style="display:none;">

				<p>Within Walking Distance : <a href="https://google.com/">Soto Ayam Cak Sam</a></p>
				<p>Within Walking Distance : <a href="https://google.com/">Soto Kuali Solo</a></p>

			</span>

			<span id="text3" style="display:none;">

				<p>Within Walking Distance : <a href="https://google.com/">Rawon Setan</a></p>
				<p>Within Walking Distance : <a href="https://google.com/">Steak Sapi</a></p>

			</span>

			<span id="text4" style="display:none;">

				<p>Within Walking Distance : <a href="https://google.com/">BPK Ginting</a></p>
				<p>Within Walking Distance : <a href="https://google.com/">Sop Daging</a></p>

			</span>

		</div>

	</body>

</html>

    When I put the code on the body of my wordpress page, all of the description is displayed even before I choose any on the select tag.

    Is there any problem in my code?
    Please help!

    Thanks,
    Regards,
    BD

    PS: My page is not published yet, so I don’t have any link on the site. But I can publish it in case someone want to see it. Just let me know!

Viewing 4 replies - 1 through 4 (of 4 total)

  • The <div> between </head> and <body> is errant – the <link> belongs in the <head>. The <div> somewhere in the <body>.

    That as far I got before I thought a browser would quit trying to show your page.

    Thread Starter batamdine

    (@batamdine)

    ummmm.. can you elaborate more..?

    As far as I see, the <div> is inside the <body>, and I put </div> before the </body>

    Did I do wrong? Please guide me…

    Regards,
    BD

    Please guide me…

    If your own code as posted does not show this in detail to you, I cannot.

    Thread Starter batamdine

    (@batamdine)

    Thank you for your help.

    After I delete the <head> to </head>, the HTML is working fine.
    However, due to strange reason, wordpress keep trimmed my code.

    But I found a good plugin, https://www.ads-software.com/extend/plugins/embedit-pro/ (no advertising intended), and my HTML is now working properly.

    Regards,
    BD

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Why This HTML Code Deoesn't Work Properly’ is closed to new replies.

Tags