Skip to content

Instantly share code, notes, and snippets.

View TrishZwei's full-sized avatar

Trish Ladd TrishZwei

9 followers · 8 following
  • San Diego
View GitHub Profile
@TrishZwei
TrishZwei / Based Off Brad Frost's Toggle
Created August 5, 2021 03:58
Pure JS toggle based off of Brad Frost's jQuery toggle
//this is based off of Brad Frost's jQuery toggle
document.querySelector('html').setAttribute('class', 'js'); //if you want to use Progressive Enhancement on the page, put class="no-js" into the html tag of the document. If you don't care you can skip this line.
var menulink = document.getElementById('menu-link');
var menu = document.getElementById('menu');
menulink.onclick = function(){
menulink.classList.toggle('active');
menu.classList.toggle('active');
return false;
@TrishZwei
TrishZwei / meta.txt
Last active April 21, 2016 19:14
a set of meta tags, swiped directly from W3 schools to put into my website as an example.
<meta charset="UTF-8">
<meta name="description" content="Free Web tutorials">
<meta name="keywords" content="HTML,CSS,XML,JavaScript">
<meta name="author" content="Hege Refsnes">
<meta name="viewport" content="width=device-width, initial-scale=1">
@TrishZwei
TrishZwei / randomorder.html
Last active April 4, 2022 14:39
Array sorter for randomized order of presentations for students
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Random Student Order</title>
</head>
<body>
<h1>Order of Presentations</h1>
<p>Determined by a randomly shuffled array:</p>
<div id="message"></div>
@TrishZwei
TrishZwei / rectHit
Last active August 5, 2021 03:52
rectHit: A formulaic hit detect for squares and rectangles
function rectHit(rectone, recttwo){
//console.log('recthit called');
var r1 = $(rectone);
var r2 = $(recttwo);
var r1x = r1.offset().left;
var r1w = r1.width();
var r1y = r1.offset().top;
var r1h = r1.height();
@TrishZwei
TrishZwei / Circle Hit
Last active August 5, 2021 03:51
circleHit: a formulaic hit detection for two circles. Pass in the two objects you want to check against to see if they are in collision.
function circleHit(circle1, circle2) {
//circle1 is first parameter, circle2 is second parameter
//in bullet vs. enemy circle1 is the current bullet, circle2 is the current enemy
var c1 = $(circle1); //assigns to new local variable
var c2 = $(circle2);
c1.r = c1.width() / 2; //r stands for radius
c1.x = c1.position().left + c1.r;
c1.y = c1.position().top + c1.r;
@TrishZwei
TrishZwei / joke
Created May 3, 2015 20:13
The old programmer goes to the store joke....
<!DOCTYPE html>
<html>
<head>
<title>Day 2 - Slide 31 Code Joke Example</title>
<style type="text/css">
body{
font-size: 20px;
font-family: Verdana;
}
</style>
@TrishZwei
TrishZwei / Scroll To Section
Last active August 29, 2015 14:15
A page that allows for scrolling to a section. Uses JavaScript but even if JS is turned off, the basic functionality is there. (No scrolling, but will go to section)
<doctype! html>
<html>
<head>
<meta charset="utf-8">
<title>Dynamic Scrolling to Section</title>
<style type="text/css">
nav {
width: 100%;
margin: 0 auto;
text-align: center;
@TrishZwei
TrishZwei / htmlElementIs
Last active August 29, 2015 14:14
Element Identifier Helper Function
function htmlElementIs(element){
var element = element.toString();
return element;
}
//usage
var myElement = document.body.children[0].children[0]; //gets my targeted element
console.log(htmlElementIs(myElement)); //returns ex: [object HTMLUListElement]
//more specific version:
function htmlElementIs(element){
@TrishZwei
TrishZwei / HTML DOM Test
Created January 23, 2015 18:49
<html>
<head>
<title>My Page</title>
</head>
<body>
<header>
<nav>
<ul class="menu">
<li><a href="#">Link One</a></li>
<li><a href="#">Link Two</a></li>
@TrishZwei
TrishZwei / querySelector Methods
Last active August 29, 2015 14:12
Learning a bit about the querySelector() and the querySelectorAll() methods
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Selector Methods</title>
</head>
<body>
<div class="mtclass">Some text</div>
<div class="mtclass">Some more text</div>
<div class="mtclass">Some other text</div>