Capture the next main block element using JS.

Question

The line in question is the var el2. I'm looking to hilite both the h element the script scrolls to * and * the next main block element (h, p, div, pre etc) below it. The best I've done so far is this:

/* ScrollToThenFlash */(function(){var d=document;d.body.appendChild(d.createElement('script')).text="(function(){var d=document;function findPos(obj){var curtop=0;if(obj.offsetParent){do{curtop+=obj.offsetTop}while(obj=obj.offsetParent);return [curtop]}};d.onclick=function(){var dael=d.activeElement;dael.style.background='#ff9 !important';dael.style.color='#444 !important';if(dael.href.indexOf('#')!=-1 && d.all[dael.href.split('#')[1]]){function flash(rep, delay){for(var i=rep;i>0;i--){setTimeout('el.style.background=\"yellow !important\";el2.style.background=\"yellow !important\";', delay*i*2);setTimeout('el.style.background=elbg;el2.style.background=elbg2;', delay*((i*2)+1))};};el=d.all[d.all[dael.href.split('#')[1]].sourceIndex];

el2=d.all[d.all[dael.href.split('#')[1]].sourceIndex+1];elbg=el.style.background;elbg2=el2.style.background;scroll(0, findPos(el));flash(7,130);return false}else return true;/* alert('leaving this page!'); */};})()";})();

It works as intended here (click on the nav links at the top of the pg): http://jibbering.com/faq/notes/closures/

But it only hilites the h element here: www.opera.com/docs/userjs/specs/

I've experimented with variations on:

el2=el.nextSibling? d.all[el.nextSibling.sourceIndex] : el.parentNode.nextSibling? d.all[el.parentNode.nextSibling.sourceIndex] : d.all[d.all[dael.href.split('#')[1]].sourceIndex+1];

But the browser (IE6 Moz4) won't have any of it. Any advice html or js related is welcome.

Answer 1

Use jQuery and do $(el).next()

http://jquery.com/

Answer 2

I'm using a mobile. I don't want to have to load a library. What is the method used?

Answer 3

Please could someone format it. I don't know how.

Answer 4

/* For the record I've found the following solution: */

            obj_el=d.all[d.all[dael.href.split('#')[1]].sourceIndex];
            try{
                function get_nextSibling(n){
                    var x=n.nextSibling;
                    while(x.nodeType!=1){
                        x=x.nextSibling
                    }
                    ;
                    return x;

                }
                ;
                obj_el2=get_nextSibling(obj_el)
            }
            catch(e){
                obj_el2=d.all[d.all[dael.href.split('#')[1]].sourceIndex+1]
            };

/* The finished code follows */

(function(){

var d=document;d.body.appendChild(d.createElement('script')).text="

(function(){

var d=document;

d.onclick=function(){

var dael=d.activeElement;dael.style.background='#ff9 !important';dael.style.color='#444 !important';

if(dael.href.indexOf('#')!=-1 && d.all[dael.href.split('#')[1]]){

function flash(rep, delay){

for(var i=rep;i>0;i--){

setTimeout('obj_el.style.background=\"yellow !important\";obj_el2.style.background=\"yellow !important\";', delay*i*2);setTimeout('obj_el.style.background=obj_elbg;obj_el2.style.background=obj_elbg2;', delay*((i*2)+1))};};

obj_el=d.all[d.all[dael.href.split('#')[1]].sourceIndex];try{

function get_nextSibling(n){

var x=n.nextSibling;while(x.nodeType!=1){x=x.nextSibling};return x;};obj_el2=get_nextSibling(obj_el)}catch(e){

obj_el2=d.all[d.all[dael.href.split('#')[1]].sourceIndex+1]};

obj_elbg=obj_el.style.background;obj_elbg2=obj_el2.style.background;

function findPos(obj){

var curtop=0;if(obj.offsetParent){do{curtop+=obj.offsetTop}while(obj=obj.offsetParent);return [curtop]};};

scroll(0, findPos(obj_el));

flash(7,130);return false}

else return true/* alert('Leaving this page!') */;}

;})()"

;})();