George Mason University Antonin Scalia Law School

Events Planning Form Using Javascript

A short questionnaire to direct users to the right form using Javscript
window.onload = function() { document.getElementById('link1').style.display = 'none'; document.getElementById('link2').style.display = 'none'; }; //Clears div box

var x, y, z; //assigns variables to radio selections

function a1(answer1){ x = answer1; };
function a2(answer2){ y = answer2; };
function a3(answer3){ z = answer3; };

//if all answers are no, display link2 and hide link2; if any answers are yes, do the opposite.

function showdiv() { if (x==1 | y==1 | z==1){ document.getElementById('link1').style.display='block'; document.getElementById('link2').style.display='none'; } else { console.log("None of the questions is 1"); document.getElementById('link1').style.display='none'; document.getElementById('link2').style.display='block'; } return; }

//How to structure your HTML to code. Onlick assigns value to x,y,z variables

<input type="radio" onclick="a1(1)" name="q1">Yes
<input type="radio" onclick="a1(0)" name="q1">No

//execute code
<button onclick="showdiv()">What Form Do I Need?</button>

//hide show divs using IDs
<div id="link1">
Link 1
</div>
<div id="link2">
Link 2
</div>

Homepage Featured Events Display Using DOM

The featured events on the Mason Law homepage is pulled from the master calendar’s RSS. To get the dates and times separated from the titles, accessing the DOM is needed. The following codes, which requires jQuery, make the magic happened:

$('.rssItemLink').each(
function(){
$this = $(this);
$this.
html('<em>' +
$this.
html().
replace(/((\d{1,2}\/){2}\d{2,4}\s*[0-9]{1,2}:[0-9]{1,2}\s*[apAP][mM]\s*to\s*[0-9]{1,2}:[0-9]{1,2}\s*[apAP][mM])/,
'</em><b>$1</b>'
)
);
}
);

Sticky Nav on Scroll

Here’s a little JavaScript function to make your site’s header or navigation stick to the top of the window when users scroll the page:

HTML:

<div id="navigation">
  <!-- your navigation code -->
</div>

CSS:

#navigation{
  position:absolute;
  top:120px;
  left:0;
}
#navigation.fixed{
  position:fixed;
  top:16px;
}

JavaScript:

// Handles the page being scrolled by ensuring the navigation is always in view.
function handleScroll(){
  // check that this is a relatively modern browser
  if (window.XMLHttpRequest){
    // determine the distance scrolled down the page
    var offset = window.pageYOffset
               ? window.pageYOffset
               : document.documentElement.scrollTop;
    // set the appropriate class on the navigation
    document.getElementById('navigation').className =
        (offset > 104 ? 'fixed' : '');
  }
}
// add the scroll event listener
if (window.addEventListener){
  window.addEventListener('scroll', handleScroll, false);
}else{
  window.attachEvent('onscroll', handleScroll);
}

Source: “Detachable navigation using JavaScript