Difference between revisions of "Template:Northeastern Boston/Javascript"

 
(10 intermediate revisions by 2 users not shown)
Line 1: Line 1:
 
<html>
 
<html>
 
<script>
 
<script>
 +
$(document).ready(function() {
 +
$('.tab-container').on("click", function() {
 +
$(this).toggleClass('tab-show');
 +
$(this).toggleClass('tab-hide');
  
−
changeSVGChildrenColor = function(element, color) {
+
var arrow = $(this).find('.tab-container__arrow')[0];
−
$(element).children().each(function ()  
+
$(arrow).toggleClass('flip-vertical');
−
{ $(this).css('fill', color); }
+
});
−
)
+
−
}
+
  
−
$(document).ready(function() {
+
$('.sub-nav__parent').on("click", function() {
−
$('#comingSoon').height($(window).height());
+
// Toggle active navbar
−
});
+
//$('.active').toggleClass('active');
  
−
document.getElementById("comingSoon").addEventListener("load", function() {
+
// Toggle active of current nav element
−
    var doc = this.getSVGDocument();
+
//var link = $(this).children()[0];
−
    logo = doc.getElementById('Logo_Logo');
+
//$(link).toggleClass('active');
−
    colorGradient(logo,'#26db80','#50e2de', 10, 30);
+
  
−
    /*var rect = doc.querySelector("rect"); // suppose our image contains a <rect>
+
// Toggle hiding of children nav elements
−
    rect.setAttribute("fill", "green");*/
+
var sibling = $(this).siblings()[0];
−
});
+
$(sibling).toggleClass('hidden');
  
−
colorGradient = function (element, start, stop, numberOfColors, opm) {
+
var arrow = $(this).find('.nav-container__arrow')[0];
−
var numberOfItems = numberOfColors;
+
$(arrow).toggleClass('flip-vertical');
−
var rainbow = new Rainbow();
+
});
−
rainbow.setNumberRange(1, numberOfItems);
+
−
rainbow.setSpectrum(start, stop);
+
−
var colors = [];
+
−
for (var i = 1; i <= numberOfItems; i++) {
+
−
    var hexColour = rainbow.colourAt(i);
+
−
    colors[i - 1] = '#' + hexColour;
+
−
}
+
−
var reversed = [];
+
−
$(colors).each(function(i) {reversed[i] = this});
+
−
reversed.reverse();
+
−
oscillation =  jQuery.merge(colors, reversed);
+
−
+
  
−
/*var interval = setInterval(function () {changeColor(element, oscillation[i % (numberOfColors * 2)]);}, 1000}); */
+
$('.minimal-dropdown__arrow').on("click", function() {
−
var i = 0;
+
$(this).toggleClass('fa-flipped-arrow');
−
var interval = setInterval(function ()  
+
$(this).parent().parent().find('.minimal-dropdown__content').toggleClass('hidden');
−
{ changeSVGChildrenColor(element, oscillation[i % (numberOfColors * 2)]);
+
});
−
i += 1;
+
−
}, 300);
+
  
−
}
+
});
−
 
+
−
changeColor = function(element, color) {
+
−
$(element).css('color', color);
+
−
}
+
  
  
 
</script>
 
</script>
 
</html>
 
</html>

Latest revision as of 00:46, 18 September 2015