My goal is to 1) load a new “top bar” element on an arbitrary site using JS bookmarklet; 2) have the top bar pinned to the top; 3) push the original content down.
Is there a reliable way to do it with CSS/JS that would work with all sites?
Edit: This is what I tried: jQuery.wrapInner() and prepend() to first, wrap the existing body content into a new DIV, and second, to insert another new DIV with fixed position to the top. I already ran into issues with jQuery.wrapInner() re-evaluating JavaScripts twice.
One alternative I can think of is to proxy the original page through my website and have the original as iFrame (just like Digg does).
This cannot be done reliably because JavaScript gets re-evaluated when injected into the host page. For some host pages it won’t matter, for others it creates a complete mess. Now I understand why iFrame approach is used as much as it is.