diff options
Diffstat (limited to 'lib/scripts/page.js')
| -rw-r--r-- | lib/scripts/page.js | 42 |
1 files changed, 25 insertions, 17 deletions
diff --git a/lib/scripts/page.js b/lib/scripts/page.js index 77d644a38..baacee238 100644 --- a/lib/scripts/page.js +++ b/lib/scripts/page.js @@ -21,29 +21,37 @@ dw_page = { */ sectionHighlight: function() { jQuery('form.btn_secedit') - .on('mouseover', function(){ - var $tgt = jQuery(this).parent(), - nr = $tgt.attr('class').match(/(\s+|^)editbutton_(\d+)(\s+|$)/)[2], - $highlight = jQuery(), // holder for elements in the section to be highlighted - $highlightWrap = jQuery('<div class="section_highlight"></div>'); // section highlight wrapper + /* + * wrap the editable section in a div + */ + .each(function () { + let $tgt = jQuery(this).parent(); + const nr = $tgt.attr('class').match(/(\s+|^)editbutton_(\d+)(\s+|$)/)[2]; + let $highlight = jQuery(); // holder for elements in the section to be highlighted + const $highlightWrap = jQuery('<div class="section_highlight_wrapper"></div>'); + + // the edit button should be part of the highlight + $highlight = $highlight.add($tgt); // Walk the dom tree in reverse to find the sibling which is or contains the section edit marker - while($tgt.length > 0 && !($tgt.hasClass('sectionedit' + nr) || $tgt.find('.sectionedit' + nr).length)) { + while ($tgt.length > 0 && !($tgt.hasClass('sectionedit' + nr) || $tgt.find('.sectionedit' + nr).length)) { $tgt = $tgt.prev(); $highlight = $highlight.add($tgt); } - // insert the section highlight wrapper before the last element added to $highlight - $highlight.filter(':last').before($highlightWrap); - // and move the elements to be highlighted inside the section highlight wrapper - $highlight.detach().appendTo($highlightWrap); + // wrap the elements to be highlighted in the section highlight wrapper + $highlight.wrapAll($highlightWrap); }) - .on('mouseout', function(){ - // find the section highlight wrapper... - var $highlightWrap = jQuery('.section_highlight'); - // ...move its children in front of it (as siblings)... - $highlightWrap.before($highlightWrap.children().detach()); - // ...and remove the section highlight wrapper - $highlightWrap.detach(); + /* + * highlight the section + */ + .on('mouseover', function () { + jQuery(this).parents('.section_highlight_wrapper').addClass('section_highlight'); + }) + /* + * remove highlight + */ + .on('mouseout', function () { + jQuery(this).parents('.section_highlight_wrapper').removeClass('section_highlight'); }); }, |