I've seen this so many times on the internet. People say to don't repeat yourself in programming languages. I wrote this script for my webpage but I repeated myself quite a bit.
Is it really that big of a deal?
Should I make a function?
How do I do it?
var active = '.teachers';var disabled = '.teacher-link';var width = $('.teachers .staff-outer-container').children().size() * 180;$('.staff-outer-container').css('width', width +'px');$('.teacher-link').click(function() { if (active != '.teachers') { $(active).hide(); active = '.teachers'; $(active).show(); width = $('.teachers .staff-outer-container').children().size() * 180; $('.teachers .staff-outer-container').css('width', width +'px'); $(disabled).removeClass('active').addClass('clickable'); disabled = this; $(disabled).removeClass('clickable').addClass('active'); $('#type').text('Teachers'); }});$('.admin-link').click(function() { if (active != '.administrators') { $(active).hide(); active = '.administrators'; $(active).show(); width = $('.administrators .staff-outer-container').children().size() * 180; $('.administrators .staff-outer-container').css('width', width +'px'); $(disabled).removeClass('active').addClass('clickable'); disabled = this; $(disabled).removeClass('clickable').addClass('active'); $('#type').text('Administrators'); }});$('.support-link').click(function() { if (active != '.support') { $(active).hide(); active = '.support'; $(active).show(); width = $('.support .staff-outer-container').children().size() * 180; $('.support .staff-outer-container').css('width', width +'px'); $(disabled).removeClass('active').addClass('clickable'); disabled = this; $(disabled).removeClass('clickable').addClass('active'); $('#type').text('Support Staff'); }});
editThanks for everyone's input! I'm confused on how to implement these functions. This is what I got: $('.teacher-link').click(handle_click('.teachers', 'Teachers'));
I tried this out and it didn't work.Also where do I place the function? Do I place it inside or outside $(document).ready
? Is it best to put functions at the start or the end of my script?