Answered by:
Can I use inline CSS and Javascript in the SOURCE EDITOR when creating a new page?

Question
-
Hello all,
I am a new Sharepoint user. I have created a new blank page and then enabled the SOURCE EDITOR and pasted the following CSS and Javascript code in the editor. Unfortunatley, it doesn't work (it does work in notepad and dreamweaver). Is there a workaround I'm supposed to be doing in order to get it to work in Sharepoint?<style> .found {background-color:#f99;} #searchbox {width:350px; position:absolute; _top:expression(document.body.scrollTop+document.body.clientHeight-this.clientHeight-10); left:10px; bottom:10px; background-color:#ccc; border:2px outset #ccc; padding:1px;} body > #searchbox {position:Fixed;} #searchbox fieldset {border:0;text-align:center;margin:3px;} #searchbox input {margin:1px;padding:2px;} #search {width:160px;} </style> Search this text and some more text here! <script> // Find in Page Script // copyright 2nd January 2011, 16 July 2011 by Stephen Chapman // permission to use this Javascript on your web page is granted // provided that all of the code in this script (including these // comments) is used without any alteration inPageSearch = function() {document.getElementsByClassName = function(cl) {var retnode, myclass, elem,classes; retnode = []; myclass = new RegExp('\\b'+cl+'\\b'); elem = this.getElementsByTagName('*'); for (var i = 0, ii = elem.length ; i < ii ; i++) {classes = elem[i].className; if (myclass.test(classes)) retnode.push(elem[i]);} return retnode;}; elemTop = function(elem) {return elem.top || elem.pixelTop || elem.offsetTop || 0;}; search = function(str) {nodewalk = function(node, str) {var re, m, s, r, frag, sp; for (var i = 0; i < node.length; i++) {if (node[i].hasChildNodes() && 'SCRIPT' !== node[i].nodeName) nodewalk(node[i].childNodes,str); re = new RegExp(str,'ig'); if (3 === node[i].nodeType) {m = node[i].nodeValue.match(re); s = node[i].nodeValue.split(re); frag = document.createDocumentFragment(); if (m !== null) {frag.appendChild(document.createTextNode(s[0])); for (var j = 0, jj = m.length; j < jj; j++) {sp = document.createElement('span'); sp.appendChild(document.createTextNode(m[j])); sp.className = 'found'; frag.appendChild(sp); if (s[j+1] == undefined) s[j+1] = ' '; frag.appendChild(document.createTextNode(s[j+1]));} node[i].parentNode.replaceChild(frag,node[i]);i+=jj*2;}}}}; nodewalk(document.getElementsByTagName('body')[0].childNodes, str);}; clearfound = function(node) {var txt = node.previousSibling.nodeValue + node.firstChild.nodeValue + node.nextSibling.nodeValue; node.parentNode.removeChild(node.nextSibling); node.parentNode.removeChild(node.previousSibling); node.parentNode.replaceChild(document.createTextNode(txt), node);}; var d, F, fld, inp, b1, b2, b3; d =document.createElement("div"); d.id = 'searchbox'; F = document.createElement("form"); fld = document.createElement("fieldset"); inp = document.createElement("input"); inp.type = 'text'; inp.id = 'search'; fld.appendChild(inp); b1 = document.createElement("input"); b1.type = 'button'; b1.id = 'search1'; b1.value = 'Find'; b1.title = 'Find all and jump to first'; fld.appendChild(b1); b2 = document.createElement("input"); b2.type = 'button'; b2.id = 'search2'; b2.value = 'Find Next'; b2.title = 'Jump to next found element'; fld.appendChild(b2); b3 = document.createElement("input"); b3.type = 'button'; b3.id = 'searchx'; b3.value = 'X'; b3.title = 'Close in page search'; fld.appendChild(b3); F.appendChild(fld); d.appendChild(F); document.getElementsByTagName('body')[0].appendChild(d); document.getElementById('search1').onclick = function() {var nodes = document.getElementsByClassName('found'); for (var i = nodes.length - 1; i >= 0; i--) clearfound(nodes[i]); search(document.getElementById('search').value); window.scrollTo(0, elemTop(document.getElementsByClassName('found')[0])); return false;}; document.getElementById('search2').onclick = function() {var nodes = document.getElementsByClassName('found'); clearfound(nodes[0]); window.scrollTo(0, elemTop(document.getElementsByClassName('found')[0])); return false;}; document.getElementById('searchx').onclick = function() {var nodes = document.getElementsByClassName('found'); for (var i = nodes.length - 1; i >= 0; i--) clearfound(nodes[i]); document.getElementById('searchbox').style.display = 'none'; setTimeout(function() {document.getElementsByTagName('body')[0].removeChild(document.getElementById('searchbox'));},5);};}; inPageSearch(); </script>
Thursday, September 29, 2011 11:48 PM
Answers
-
The publishing html field control does not allow this.
You could use a content editor web part - but be aware that you might need to tweak your script slightly to get it working:
http://sharepointsolutions.blogspot.com/2007/07/adding-javascript-to-content-editor-web.html
Stefan Goßner
Senior Escalation Engineer - Microsoft CSS
This post is provided "AS IS" with no warrenties and confers no rights.- Marked as answer by Qiao WeiModerator Thursday, October 6, 2011 9:21 AM
Friday, September 30, 2011 9:48 AM