1
|
/**
|
2
|
* Expected dom structure:
|
3
|
* <li class="dynabox">
|
4
|
<div class="dynabox_label"><span class="label">Label Text</span>
|
5
|
<ul class="dynabox_content" title="{url-to-content}"><li> ...... </li></ul>
|
6
|
</li>
|
7
|
*/
|
8
|
|
9
|
// see also https://github.com/geetarista/jquery-plugin-template/blob/master/jquery.plugin-template.js
|
10
|
|
11
|
// the semi-colon before function invocation is a safety net against concatenated
|
12
|
// scripts and/or other plugins which may not be closed properly.
|
13
|
;(function($, document, window, undefined) {
|
14
|
|
15
|
$.fn.footnotes = function(eventSource) {
|
16
|
|
17
|
var element;
|
18
|
|
19
|
// firebug console stub (avoids errors if firebug is not active)
|
20
|
if(typeof console === "undefined") {
|
21
|
console = { log: function() { } };
|
22
|
}
|
23
|
|
24
|
if( eventSource !== undefined ){
|
25
|
// if ahahContent() has been called as event handler use the eventSource
|
26
|
element = $(eventSource);
|
27
|
console.log("ahahContent() as domEventHandler for " + element);
|
28
|
} else {
|
29
|
// otherwise use this jQuery object
|
30
|
element = $(this);
|
31
|
console.log("ahahContent() as jQuery function for " + element);
|
32
|
}
|
33
|
|
34
|
|
35
|
element.find('span.footnote-key a').mouseover(function(e){
|
36
|
var fnClassName = getFootnoteClassName(this);
|
37
|
var fnKeyClassName = getFootnoteKeyClassName(this);
|
38
|
$('.footnote').css('background-color', 'transparent').css('background-color', 'transparent').removeClass('active');
|
39
|
$('span.footnote-key a').css('background-color', 'transparent').css('background-color', 'transparent').removeClass('active');
|
40
|
$(fnClassName).css('background-color', 'yellow');
|
41
|
$(fnKeyClassName).css('background-color', 'yellow');
|
42
|
}
|
43
|
).mouseout(function(e){
|
44
|
var fnClassName = getFootnoteClassName(this);
|
45
|
var fnKeyClassName = getFootnoteKeyClassName(this);
|
46
|
$(fnClassName).not('.active').css('background-color', 'transparent');
|
47
|
$(fnKeyClassName).not('.active').css('background-color', 'transparent');
|
48
|
}
|
49
|
).click(function(e){
|
50
|
var fnClassName = getFootnoteClassName(this);
|
51
|
var fnKeyClassName = getFootnoteKeyClassName(this);
|
52
|
$('.footnote').css('background-color', 'transparent').removeClass('active');
|
53
|
$('span.footnote-key a').css('background-color', 'transparent').removeClass('active');
|
54
|
$(fnClassName).css('background-color', 'yellow').addClass('active');
|
55
|
$(fnKeyClassName).css('background-color', 'yellow').addClass('active');
|
56
|
});
|
57
|
|
58
|
function getFootnoteClassName(object){
|
59
|
return '.'+$(object).attr('href').substr(1);
|
60
|
}
|
61
|
|
62
|
function getFootnoteKeyClassName(object){
|
63
|
return '.'+$(object).attr('href').substr(1).replace(/-/gi, '-key-') + ' a';
|
64
|
}
|
65
|
|
66
|
};
|
67
|
|
68
|
})(jQuery, document, window);
|
69
|
|
70
|
jQuery(document).ready(
|
71
|
function() {
|
72
|
//
|
73
|
jQuery('body').footnotes();
|
74
|
|
75
|
// register the ahahContent as domEventHandler
|
76
|
// see domEvents.js
|
77
|
//
|
78
|
// the for example dynabox will execute the callback after loading
|
79
|
// the content into the dynabox. By this it is for possible
|
80
|
// to have ahahContent content inside of dynaboxes
|
81
|
document.domEventHandlers.push(jQuery().footnotes);
|
82
|
}
|
83
|
);
|