•
•
•
•
What is DaniWeb IT Discussion Community?
You're currently browsing the JavaScript / DHTML / AJAX section within the Web Development category of DaniWeb, a massive community of 456,481 software developers, web developers, Internet marketers, and tech gurus who are all enthusiastic about making contacts, networking, and learning from each other. In fact, there are 2,831 IT professionals currently interacting right now! Registration is free, only takes a minute and lets you enjoy all of the interactive features of the site.
Please support our JavaScript / DHTML / AJAX advertiser: Lunarpages Web Hosting
Views: 4697 | Replies: 15
![]() |
Calling MattEvans, Please assist?
G'day mate, I played around with your suggestions on the date you posted, but got nowhere. I havent been able to use a pc since because I had a heartattack and have just returned from Hospital. If you can spare some time, Id greatly appreciate your skill with the code. Thanks, Dan
G'day mate, I played around with your suggestions on the date you posted, but got nowhere. I havent been able to use a pc since because I had a heartattack and have just returned from Hospital. If you can spare some time, Id greatly appreciate your skill with the code. Thanks, Dan
Always carry a flagon of whiskey in case of snakebite and furthermore always carry a small snake.
W. C. Fields
W. C. Fields
•
•
Join Date: Jul 2006
Location: Deptford, London
Posts: 971
Reputation:
Rep Power: 5
Solved Threads: 48
OK, im using the following js
There is some css but thats not important here. This code creates a small box inside posts to the left of a paragraph, its like footnotes but quicker
the js above goes in the page head. At present a user is required to type the following in a post to acheive the effect...
what I want to do ,is to create a single 'sidenote' button, that will output (in the post) the following
and the user will replace 'Text' with his/her sidenote.
example seen here
http://herproom.5.forumer.com/index....t=0&#entry6913
/*
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://lab.arc90.com/tools/c/css/arc90hosted_sidenote.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);There is some css but thats not important here. This code creates a small box inside posts to the left of a paragraph, its like footnotes but quicker
the js above goes in the page head. At present a user is required to type the following in a post to acheive the effect...
[dohtml]<span class="sidenote" title="Text here is the actual sidenote"></span>[/dohtml]
what I want to do ,is to create a single 'sidenote' button, that will output (in the post) the following
[dohtml]<span class="sidenote" title="Text"></span>[/dohtml]
and the user will replace 'Text' with his/her sidenote.
example seen here
http://herproom.5.forumer.com/index....t=0&#entry6913
Last edited by Inny : Feb 3rd, 2007 at 5:42 pm.
Always carry a flagon of whiskey in case of snakebite and furthermore always carry a small snake.
W. C. Fields
W. C. Fields
•
•
Join Date: Jul 2006
Location: Deptford, London
Posts: 971
Reputation:
Rep Power: 5
Solved Threads: 48
<script type="text/javascript">
function addSidenote(){
var myTextArea = document.getElementById("commentBox");
myTextArea.value = myTextArea.value + '[dohtml]<span class="sidenote" title="Text"></span>[/dohtml]';
}
</script>
<textarea id="commentBox"/>
<input type="button" onclick="addSidenote();" value="Add a Sidenote"/>That code will create a new textarea for the benefit of demonstration. You'll want to link it to your existing textarea. Looking at the source of the page in your link; this is your textarea:
<TD><b>Quick Comment:</b></TD></tr><tr><TD><textarea cols="40"rows="5" scrollbars="yes" name="field1" value="" ></textarea></TD>
You'll want to add an id attribute to that text area; something like this:
<TD><b>Quick Comment:</b></TD></tr><tr><TD><textarea cols="40"rows="5" scrollbars="yes" name="field1" value="" id="commentBox" ></textarea></TD>
Now if you remove the textarea from my example; and put the code on your page somewhere, the code will relate to your comment box; and should work ok.
Plato forgot the nullahedron..
![]() |
•
•
•
•
•
•
•
•
DaniWeb JavaScript / DHTML / AJAX Marketplace
•
•
•
•
Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
- Input Tag attribute (HTML and CSS)
Other Threads in the JavaScript / DHTML / AJAX Forum
- Previous Thread: Got a funny bit of javascript
- Next Thread: how does this work?


Linear Mode