Im using This nifty code that works Great in IE but not so great in Mozilla,
In ie if you add an image, the sidenote fits around it, but in mozilla the image just sits over the top. please help
preveiw
veiw in both browsers to see the problem.
css
In ie if you add an image, the sidenote fits around it, but in mozilla the image just sits over the top. please help
preveiw
veiw in both browsers to see the problem.
Code:
/*
Unobtrusive Sidenotes v1.3.5 (Hosted)
(c) Arc90, Inc.
http://www.arc90.com
http://lab.arc90.com
Licensed under : Creative Commons Attribution 2.5 http://creativecommons.org/licenses/by/2.5/
*/
/* Globals */
var arc90_isIE = document.all? true: false;
var arc90_sideCLRs = 4; // total colours declared in the CSS for sidenote usage
/* Pre-Load */
function arc90_preload() {
var head = document.getElementsByTagName('HEAD');
// add the css
var l = arc90_newNode('link');
try {
l.rel = "stylesheet";
l.type="text/css";
l.href="http://h1.ripway.com/Inny/clearsidenote.css";
// fully create the link then attach to the HEAD
head[0].appendChild(l);
} catch(e) {
l = null;
}
}
arc90_preload();
/* Main */
function arc90_sidenote() {
/* Blogger Fix: removes the crappy empty 'clear: both' div */
D = document.getElementsByTagName('DIV');
for (var j = 0, k = D.length, c = 0; j < k; j++) {
var d = D[j];
if (d.innerHTML == '' && d.style.clear == 'both')
d.style.clear = 'none';
}
O = document.getElementsByTagName('SPAN');
for (var i = 0, l = O.length, c = 0; i < l; i++) {
var o = O[i];
if (o != null && o.className && o.className.indexOf('sidenote') >= 0) {
try {
var s = arc90_newNode('div', '', 'arc90_sidenoteTXT arc90_sidenoteCLR' +c);
var a = arc90_newNode('div', '', 'arc90_inline');
a.innerHTML = arc90_gtlt(o.title);
s.appendChild(a);
o.parentNode.parentNode.insertBefore(s, o.parentNode);
o.className = 'arc90_sidenoteLNK arc90_sidenoteCLR' +c;
c = c + 1 < arc90_sideCLRs? c+1: 0;
} catch (err) {
o = null;
}
}
}
}
function arc90_gtlt(s) {
s = s.replace(/>/g, '>');
s = s.replace(/</g, '<');
return s;
}
/* Events */
function arc90_isString(o) { return (typeof(o) == "string"); }
function arc90_addEvent(e, meth, func, cap) {
if (arc90_isString(e)) e = document.getElementById(e);
if (e.addEventListener){
e.addEventListener(meth, func, cap);
return true;
} else if (e.attachEvent)
return e.attachEvent("on"+ meth, func);
return false;
}
/* Nodes */
function arc90_newNode(t, i, s, x, c) {
var node = document.createElement(t);
if (x != null && x != '') {
var n = document.createTextNode(x);
node.appendChild(n);
}
if (i != null && i != '')
node.id = i;
if (s != null && s != '')
node.className = s;
if (c != null && c != '')
node.appendChild(c);
return node;
}
/* Add Events */
arc90_addEvent(window, 'load', arc90_sidenote);
Code:
.arc90_sidenoteLNK { padding: 0 .3em; }
.arc90_sidenoteTXT {
width: 12em;
line-height: 1.2em;
font-size: .8em;
padding: .5em;
}
div.arc90_sidenoteCLR0, div.arc90_sidenoteCLR2 {
margin: 1em 0 1em 1em;
float: right;
}
div.arc90_sidenoteCLR1, div.arc90_sidenoteCLR3 {
margin: 1em 1em 1em 0;
float: left;
}
.arc90_sidenoteCLR0 {
background-color:;
border: 1px solid #318484
}
.arc90_sidenoteCLR2 {
background-color:;
border: 1px solid #FF3535;
}
.arc90_sidenoteCLR1 {
background-color:;
border: 1px solid #F2D700;
}
.arc90_sidenoteCLR3 {
background-color:;
border: 1px solid #039B00;
}
Comment