1 | $(function() { |
---|
2 | var create_name = function(text) { |
---|
3 | |
---|
4 | // Convert text to lower case. |
---|
5 | var name = text.toLowerCase(); |
---|
6 | |
---|
7 | // Remove leading and trailing spaces, and any non-alphanumeric |
---|
8 | // characters except for ampersands, spaces and dashes. |
---|
9 | name = name.replace(/^\s+|\s+$|[^a-z0-9&\s-]/g, ''); |
---|
10 | |
---|
11 | // Replace '&' with 'and'. |
---|
12 | name = name.replace(/&/g, 'and'); |
---|
13 | |
---|
14 | // Replaces spaces with dashes. |
---|
15 | name = name.replace(/\s/g, '-'); |
---|
16 | |
---|
17 | // Squash any duplicate dashes. |
---|
18 | name = name.replace(/(-)+\1/g, "$1"); |
---|
19 | |
---|
20 | return name; |
---|
21 | }; |
---|
22 | |
---|
23 | var add_link = function() { |
---|
24 | |
---|
25 | // Convert the h2 element text into a value that |
---|
26 | // is safe to use in a name attribute. |
---|
27 | var name = create_name($(this).text()); |
---|
28 | |
---|
29 | // Create a name attribute in the following sibling |
---|
30 | // to act as a fragment anchor. |
---|
31 | $(this).next().attr('name', name); |
---|
32 | |
---|
33 | // Replace the h2.toggle element with a link to the |
---|
34 | // fragment anchor. Use the h2 text to create the |
---|
35 | // link title attribute. |
---|
36 | $(this).html( |
---|
37 | '<a href="#' + name + '" title="Reveal ' + |
---|
38 | $(this).text() + ' content">' + |
---|
39 | $(this).html() + '</a>'); |
---|
40 | }; |
---|
41 | |
---|
42 | var toggle = function(event) { |
---|
43 | event.preventDefault(); |
---|
44 | |
---|
45 | // Toggle the 'expanded' class of the h2.toggle |
---|
46 | // element, then apply the slideToggle effect |
---|
47 | // to all siblings. |
---|
48 | $(this).toggleClass('expanded'). |
---|
49 | nextAll().slideToggle('fast'); |
---|
50 | }; |
---|
51 | |
---|
52 | var remove_focus = function() { |
---|
53 | // Use the blur() method to remove focus. |
---|
54 | $(this).blur(); |
---|
55 | }; |
---|
56 | |
---|
57 | $(document).ready (function () { |
---|
58 | if ($(window).width() < 1024) { |
---|
59 | |
---|
60 | // Set toggle class to each #sidebar h2 |
---|
61 | $("#sidebar div div h2").addClass('toggle'); |
---|
62 | |
---|
63 | // Hide all h2.toggle siblings |
---|
64 | $('#sidebar div div h2').nextAll().hide(); |
---|
65 | |
---|
66 | // Add a link to each h2.toggle element. |
---|
67 | $('h2.toggle').each(add_link); |
---|
68 | |
---|
69 | // Add a click event handler to all h2.toggle elements. |
---|
70 | $('h2.toggle').click(toggle); |
---|
71 | |
---|
72 | // Remove the focus from the link tag when accessed with a mouse. |
---|
73 | $('h2.toggle a').mouseup(remove_focus); |
---|
74 | } |
---|
75 | }) |
---|
76 | |
---|
77 | }); |
---|