Things About Web Design Logo

Things About Web Design

PHP CSS MySQL JS Scripts & Tutorials

JS Snippets


.

JavaScript Toggle Show Hide Element

Some JavaScript for fun 😀

Click the button to make text disappear 😎

1

<script> var callOne = true; function one() { var x = document.getElementById("demo"); x.style.fontSize = "25px"; x.style.color = "red"; } function two() { var x = document.getElementById("demo"); x.style.fontSize = "0px"; x.style.color = "black"; } function call(){ if(callOne) one(); else two(); callOne = !callOne; } </script> <p style="font-size:0px" id="demo">Click the button to make text disappear 😎</p> <button onclick="call();">Click Me!</button>
.

JavaScript Current Full Year

The JavaScript code below returns the current year like: ""

2

<script> var today = new Date() var year = today.getFullYear() document.write(year) </script>
.

JavaScript New Document Reload

The JS code below loads a new page. Good for getting new on page PHP script results. (Not a true browser refresh!)
Use PHP <?php header("Location: http://www.example.com/");?> or just an HTML link for browser refresh:

3

<p><input type="button" value="Load New Document" onclick="newDoc()"></p> <script> function newDoc() { window.location.assign("current.php") } </script>
.

JavaScript Page Last Updated

The JavaScript code below gives the last date a website page was updated:

4

<script> // Last Update script var m = "Page Last Updated " + document.lastModified; var p = m.length-8; document.writeln(""); document.write(m.substring(p, 0)); document.writeln(""); </script>
.

JavaScript Script History Go Back / Forward

The JavaScript and HTML below can go back (-1) or forward (1) as many pages as you want:
Note: Browser back retains previous page data. Page back refreshes previous page.

3

<button onclick="goBack()">Go Back 1 Pages</button> <script> function goBack() { window.history.go(-1); </script>
.

JavaScript Form History Go Back

Creates button like above but no script involved:
Note: PHP Javascript and HTML may call for different types of back

2

<form><input type="button" value="No, really, go back!" onclick="history.go(-1)"></form>
.

JavaScript Show And Hide Sidebar

1