Skip to content

Instantly share code, notes, and snippets.

View steveshead's full-sized avatar
💭
Inspired by genius - driven by passion

Steve Shead steveshead

💭
Inspired by genius - driven by passion
5 followers · 1 following
View GitHub Profile
@steveshead
steveshead / index.html
Last active February 21, 2021 02:00
[Javascript - Promisifying the Geolocation API] - promisifying the geolocation API to show country details in HTML, and location details in the console.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<link rel="stylesheet" href="style.css" />
<script defer src="script.js"></script>
<script defer src="assignments.js"></script>
<title>Asynchronous JavaScript</title>
@steveshead
steveshead / index.html
Created February 27, 2021 16:12
[Javascript - simple, dismissable popup] - a simple, dismissable popup on page load example
<!-- Not my work - edited for my use -->
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Bootstrap CSS -->
@steveshead
steveshead / script.js
Created April 26, 2021 02:08
[Javascript - Highlight nav item on scroll ] - vanilla javascript scroll spy
window.addEventListener('DOMContentLoaded', () => {
const observer = new IntersectionObserver(entries => {
entries.forEach(entry => {
const id = entry.target.getAttribute('id');
if (entry.intersectionRatio > 0) {
document.querySelector(`nav li a[href="#${id}"]`).parentElement.classList.add('active');
} else {
document.querySelector(`nav li a[href="#${id}"]`).parentElement.classList.remove('active');
}
@steveshead
steveshead / favorite.php
Created July 3, 2021 14:40
[Ajax - favorite a blog post ] - Using ajax to update without page refresh
<?php
session_start();
if(!isset($_SESSION['favorites'])) { $_SESSION['favorites'] = []; }
function is_ajax_request() {
return isset($_SERVER['HTTP_X_REQUESTED_WITH']) &&
$_SERVER['HTTP_X_REQUESTED_WITH'] == 'XMLHttpRequest';
}
@steveshead
steveshead / index.html
Created July 3, 2021 14:44
[ Ajax - show sub-categories based on category selected ] - Use ajax to show the sub-categories based on the primary category selected
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous">
<script src="https://kit.fontawesome.com/6b773fe9e4.js" crossorigin="anonymous"></script>
<title>Ajax Template</title>
<style>