JavaScript - Adding Onclick And Href Functionality To Billboard Script

Hi all,

I have been using a border-fading script to give the impression of onmouseover fading underline, and I wish to tweak it a bit to give a slightly different effect

I have two scripts that do virtually the same thing, although the second has a display bug in FF both have their advantages and I don't have my heart set on using either one, although Vic's scripts are being used all over the page i'm creating so his has first dibs

here they are, and I will describe what I need to do below:
first script:
Code:

startColor = "FFFFFF"; // MouseOut link color 
endColor = "000000"; // MouseOver link color 

stepIn = 20; // delay when fading in 
stepOut = 30; // delay when fading out 

var fading=new Array();
fading['now']=startColor;

function initLinkFade() {
  var links = document.getElementById('pageHolder').getElementsByTagName('A');
  for(var i=0;i<links.length;i++){
    links[i].onmouseover = domouseover;
    links[i].onmouseout = domouseout;
    }
  }

if(document.getElementsByTagName){
  window.onload = initLinkFade;
  document.write("<style type='text/css'>#pageHolder a{text-decoration:none}</style>");
  }

function domouseover() { 
  var rel="nofollow" target=arguments[0]?arguments[0].target:event.srcElement;
  if(target.nodeName!='A')return;
  for(var i=0;i<fading.length;i++) 
    clearTimeout(fading[i]);
  if(fading['el']!=target && fading['el']){
    fading['el'].style.borderBottom = "1px solid #"+startColor;
    linkFade(startColor,endColor,target,stepIn);
    }
  else
    linkFade(fading['now'],endColor,target,stepIn);
  } 

function domouseout() { 
  var rel="nofollow" target=arguments[0]?arguments[0].target:event.srcElement;
  if(target.nodeName!='A')return;
  for(var i=0;i<fading.length;i++) 
    clearTimeout(fading[i]);
  if(fading['el']!=target && fading['el']){
    fading['el'].style.borderBottom = "1px solid #"+startColor;
    linkFade(endColor,startColor,target,stepOut);
    }
  else
    linkFade(fading['now'],startColor,target,stepOut);
  } 

function hex(i) { 
  var s=Math.floor(i).toString(16);
  return s.length==2?s:"0"+s;
  } 

function linkFade(s,e,element,step){
  fading['el']=element;
  var sr=parseInt(s.substr(0,2),16);
  var sg=parseInt(s.substr(2,2),16);
  var sb=parseInt(s.substr(4,2),16);
  var er=parseInt(e.substr(0,2),16);
  var eg=parseInt(e.substr(2,2),16);
  var eb=parseInt(e.substr(4,2),16);
  for(var i = 0; i <= step; i++) {
    var r=hex((sr*(step-i)+er*i)/step);
    var g=hex((sg*(step-i)+eg*i)/step);
    var b=hex((sb*(step-i)+eb*i)/step);
    fading[i]=setTimeout("fading['now']='"+r+g+b+"';fading['el'].style.borderBottom = '1px solid #'+fading['now']",i*step); 
    } 
  }

What I like about this one is that you can specify both the fade in and fade out speeds, allowing you a bunch of flexibility in how it looks also, I like how it allows you to set it to 'apply to all links in a given div... however that can have certain downfalls you can seethis script in action he www.enviromark.ca/head/YPP.htm
the second script
Code:

<!--
// by Vic Phillips (04-September-2006) http://www.vicsjavascripts.org.uk

function zxcMseOver(zxcobj,zxcd){
 var zxcp=zxcobj;
 if (!zxcp.oop){ return; }
 clearTimeout(zxcp.oop.to);
 zxcp.oop.d=zxcd||0;
 zxcp.oop.cng();
}

function zxcInit(zxccls,zxccol1,zxccol2,zxcstps){
 var zxclks=document.getElementsByTagName('BODY')[0].getElementsByTagName('A');
 for (var zxc0=0;zxc0<zxclks.length;zxc0++){
  if (zxclks[zxc0].className==zxccls){
  zxcStyle(zxclks[zxc0],{borderBottom:'solid '+zxccol1+' 0px;'});
  zxclks[zxc0].oop=new zxcOOP(zxclks[zxc0],zxccol1,zxccol2,zxcstps);
  }
 }
}

var zxcCnt=0;

function zxcOOP(zxcd,zxccol1,zxccol2,zxcstps){
 this.obj=zxcd;
 this.ary=zxcSTxtColors([zxccol1,zxccol2],zxcstps||10);
 this.cnt=0;
 this.d=1
 this.to=null;
 this.ref='zxcoop'+zxcCnt;
 window[this.ref]=this;
 zxcCnt++;
}

zxcOOP.prototype.cng=function(){
 if ((this.d>0&&this.cnt<this.ary.length-1)||(this.d<0&&this.cnt>0)){
  this.obj.style.borderBottom='solid #'+this.ary[this.cnt+=this.d]+' 1px';
  this.setTimeOut("cng();",100);
 }
 else if (this.d<0) {
  this.obj.style.borderBottom='0px';

 }
}

zxcOOP.prototype.setTimeOut=function(zxcf,zxcd){
 this.obj.to=setTimeout("window."+this.ref+"."+zxcf,zxcd);
}



function zxcStyle(zxcele,zxcstyle){
 if (typeof(zxcele)=='string'){ zxcele=document.createElement(zxcele); }
 for (key in zxcstyle){ zxcele.style[key]=zxcstyle[key]; }
 return zxcele;
}


function zxcSTxtColors(zxcc,zxcnu){
 var zxcary=[];
 zxcc1=zxcc[0].replace('#',''); zxcc2=zxcc[1].replace('#','');
 var zxcr=zxcHexToInt(zxcc1.substring(0,2));
 var zxcg=zxcHexToInt(zxcc1.substring(2,4));
 var zxcb=zxcHexToInt(zxcc1.substring(4,6));
 var zxcr2=zxcHexToInt(zxcc2.substring(0,2));
 var zxcg2=zxcHexToInt(zxcc2.substring(2,4));
 var zxcb2=zxcHexToInt(zxcc2.substring(4,6));
 var zxcrstep=Math.round((zxcr2-zxcr)/zxcnu);
 var zxcgstep=Math.round((zxcg2-zxcg)/zxcnu);
 var zxcbstep=Math.round((zxcb2-zxcb)/zxcnu);
 for (zxc0=0;zxc0<zxcnu;zxc0++){
  zxcary[zxc0]=zxcIntToHex(zxcr)+zxcIntToHex(zxcg)+zxcIntToHex(zxcb);
  zxcr+=zxcrstep; zxcg+=zxcgstep; zxcb+=zxcbstep;
 }
 zxcary[zxcnu-1]=zxcc[1].substring(1);
 return zxcary;
}

function zxcIntToHex(zxcn){
 zxcn=(zxcn>255)?255:(zxcn<0)?0:zxcn;
 var zxcresult=zxcn.toString(16);
 if (zxcresult.length==1){ zxcresult="0"+zxcresult; }
 return zxcresult;
}

function zxcHexToInt(zxchex){
 return parseInt(zxchex,16);
}


//-->

activated by:
<body onload="zxcInit('mainLinks','#FFFFFF','#000000',15);">
...
<a class="mainLinks" href="#advantagesRisks" onmouseover="zxcMseOver(this,1);"  onmouseout="zxcMseOver(this,-1);"><img src="images/EN_advantages_risks.gif" name="imageLinkNoTouchy"></a>

I like this script because it allows you to set the fade on a per-link basis, not on a per-div basis... more control
alrighty, here are the minor modifications I am hoping to get help with The fade-out effects stop when a second link is onmouseover'd. I would like to be able to set both the fade-in and fade-out delays (like in the first script), but have the fade-out continue for "Link A" even if "Link B" is onmouse'd over. Basically getting the smooth-fade effect seen he www.enviromark.ca/head/ --> the gray icons. When a link is clicked, I would like the top border of the link to fade in and stay solid until another link is clicked. When another link is clicked, I would like it's top border to fade in (like the first link) a have the first link's top border fade out. Again you can see the effect I'm going for at the link above by clicking on a few of the vertical links and seeing it's effect on the horizontal images
I know this might be a lot to ask, so I suppose I could live with the script I have... but I figured there was no harm in asking

Is it possible to add an onclick event to an iframe or perhaps a DIV that holds an iframe?

In specific I am using the Facebook Open Graph like button:

Code:

<iframe src="http://www.facebook.com/plugins/like.php?layout=button_count&amp;show_faces=true&amp;width=450&amp;action=like&amp;colorscheme=light&amp;href=http://urltoshare.com/" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; overflow:hidden; width:450px; height:21px"></iframe>

What I would like to do is add a simple onclick event to it so that I can run a process when the user clicks on it, at the moment I am just trying alert but cannot get it to work. By setting the iframe within a DIV with height/width specs set would an onclick event work within the DIV?

On my site, when you select something from the first drop down box, javascript creates the options to appear in a second drop down box.

I have this code:
Code:

function addOption(selectbox, value, text)
{
	var optn = document.createElement("OPTION");
	optn.text = text;
	optn.value = value;
	selectbox.options.add(optn);
}

and then this:
Code:

if(document.drop_list.Category.value == 'Assembly'){
addOption(document.drop_list.SubCat,"Electronic", "Electronic");
addOption(document.drop_list.SubCat,"Marketing", "Marketing");
addOption(document.drop_list.SubCat,"Retailing", "Retailing");
addOption(document.drop_list.SubCat,"Construction", "Construction");
}

Thats an example of how it works. What I want to now add, is an onclick to each subcategory. I want the onClick to execute the function changecolour1(). This function changes the class of a div, but ive got that sorted out so its probably irrelevent.

I want to know if anyone call tell me how to make it create the OPTION with a text, value AND onclick attributes. And then I want to be able to specifiy the value of the Onclick.

I'm pretty new at javascript, a lot of that code was written for me. Please shed some light for me.
Thanks in advance
Micomator.

Hi all,

I can't seem to add an onclick event to an image. I'm sure I am doing something wrong as I am very new to Javascript.

This is a part of my javascript code that is in the head and body of my HTML file:

Code:

<head>
<script language="JavaScript">
.....
.....
var redLocation0 = redArray[0]+".jpg";
....
....
	function redClick( buttonLocation ) {
	window.location = "http://www.yahoo.com/"
	}
....
....
</script>
</head>


<body>
<table>
<tr>
<td>
<script language="javascript">document.write('<IMG SRC="'+ redLocation0 +'">'); onclick="redClick('0')";</script>
</td>
</tr>
</table>
</body>

The image that is displayed is not clickable, and therefore the function redClick cannot be called.

Can someone please help me and tell me where I am going wrong here. I am kinda new to JavaScript.

Thanks!

Hi,

I am trying to add one image in footer of my application.

Code:
<div class="rightLinks">
<a href="#"><script src=https://seal.somesign.com/getseal?host_name=www.validsite.com&size=S&use_flash=NO&use_transparent=NO&lang=en></script></a>
</div>

But this is not working. Please let me know, what is wrong in it. And how can we correct it.

Thanks!!

Regards,
Neha

I'm a complete Noob to Java. Just retired and starting a new venture.

I need to add a sound effect to my image. I read the Onmouseover tutorial using HTML5 and its exactly what I need but as hard as I try I cannot make sense of it.

My source code:

Code:

<html><head>
  
  <meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">
  <title>You Could Win BIG!</title>
<script type="text/javascript">
//preload images first
img1=new Image()
img1.src="/images/themagicbutton.png"
img2=new Image()
img2.src="/images/themagicbutton5.png"
</script>
  
</head><body bgcolor="C4C996">

<br>
<br>
<br>
<br>
<br>

<br>
<br>
<br>
<br>
<br>
<center><a href="http://bit.ly/tZ7iUv" onMousedown="document.images['example'].src=img2.src" onMouseup="document.images['example'].src=img1.src">
<img src="/images/themagicbutton.png" name="example" border=0></a>
</body></html>

I want to ad the following sound to my image above: magic-chime-03.mp3, magic-chime-03.wav, magic-chime-03.ogg as an OnClick.

I need your expertise in setting this scipt up and where to place it in my source code.

Any help I would be eternally grateful.

I finished this code, the full code is not here, but when I ran it as a diagnostic the action did not occur when i clicked on the "process item" button. I believe it may have something to do with the script, but i am new to javascript and cannot seem to figure it out, it is supposed to multiply the price by the number to give the value of sale (sale).
Any help would be much appreciated!!!
Code:

 <html>

<script language="javascript">
function test()
{
var Items,Price,Number,sale;


Items = parselfloat(document.victoria.secondnumber.value);
Price = parselfloat(document.victoria.price.value);
Number = parselfloat(document.victoria.num.value);

sale = Price*Number;
document.victoria.val.value=sale;
}
</script>
<body><form name ="victoria">  
<center>

<table border=40 bordercolor="yellow"> 
<tr><td>Customer Number <input name ="firstnumber" type="text" size="6" value="1" ></td>
<td>Home Delivery  <input name="customer_name" type="checkbox"Checked></td><tr>
<tr><td>Items Purchased</td><td><center><input name="secondnumber" type="text" size="12"></center></td></tr>
<tr><td>Item Number</td><td><center><input name="itemnum" type="text" size="12" value="1"></center></td></tr>
<tr><td>Price</td><td><center><input name="price" type="text" size="12"></center></td></tr>
<tr><td>Number Purchased</td><td><center><input name="num" type="text" size="12"></center></td></tr>
<tr><td>Value of Sale</td><td><center><input name="val" type="text" size="12" value="0"></center></td></tr>
<tr><td>Customer Total</td><td><center><input name="total" type="text" size="12" value="0"></center></td></tr>
<tr><td></td><td><input type="button" value="Process Item" onclick="test()"></td></tr>
</table>

 
</center></form>
</body></html>

Have spent over 40 hours trying to make something like this work. Any help will be received with profound gratitude.
Code:

	<!-- First, we reference a script whose purpose is to create
		a space for session variables similar to cookies.  Works 
		if it appears early in body of Drupal page, so this is not the issue
		(Drupal parses pages down for display so there is no user <head> tag). -->
<script type="text/javascript" src="sessvars.js"></script>
<script language = "javascript">

	<!-- We create the variable whichpage because we will be creating a
			session variable sessvars.whichpage courtesy of the sessvars.js script-->
var whichpage;

	<!-- Next, we create a lookup table: -->
var myTable = new Array();
myTable[1] = "001_Front_Cover_jpg.jpg";
myTable[2] = "002_Inside_Front_Cover_jpg.jpg";
myTable[3] = "003_Frontispiece_Design_jpg.jpg";
</script>

	<!-- Next, we create a table with thumbnails;  each thumbnail image is a
		hyperlink which, onClick, is supposed to run a script assigning a value
		to sessvars.whichpage, so when Drupal node 23 is reached, it can use the
		value of sessvars.whichpage to select the array (myTable) element
		which corresponds to the full-sized picture we want to load.  Node 23
		also has the lookup array (myTable).  The node inserts the snippet contained
		in the myTable element into a URL of the picture to load. -->

	<!-- Here we define the table -->

	<!-- Next, we have a series of hyperlinks which present the table with
		thumbnails so clicking on the thumbnail assigns a value to sessvars.
		whichpage and then transfers to the node that uses that value: -->
<a href="23" onClick="<script language = 'javascript'> sessvars.whichpage=1; </script>" <img>  </img> </a>
<a href="23" onClick="<script language = 'javascript'> sessvars.whichpage=2; </script>" <img>  </img> </a>
<a href="23" onClick="<script language = 'javascript'> sessvars.whichpage=3; </script>" <img>  </img> </a>

	<!-- The problem is that this flat does not work.  When we get to node 23
		sessvars.whichpage shows as undefined.  It used to work when I called a
		function instead of put the script into each link, but I found there was
		no simple way to get the value (1,2,3 etc.) to the function -->

Is there an answer. Thank you so much in advance.

Leon Malinofsky

I'd like to place an AJAX call to load another SELECT menu in my form, and I'm having trouble finding a tutorial.
Can someone point me to a good tute, or provide some guidance/examples here?

For your Copying/Pasting pleasure , here's an example button for which I'd include the onclick():
Code:

<button type="button" >Add</button>

And here's an example SELECT menu:
Code:

<select id="idNumber" name="weekday_1['workPeriod_new'][] >
	<option value="1" >one</option>
	<option value="2" >2</option>
</select>

Thanks-a-bunch,
~ Mo

NOTE: Overall, I'm pretty green in JS.

i have been experimenting on this...i don't know why this happens
i am sure there is something wrong with my javascript code
this is what happens...
Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<script language="Javascript" type="text/javascript">
     function addRow()
     {
          // grab the element, i.e. the table your editing, in this we're calling it 
          // 'mySampleTable' and it is reffered to in the table further down on the page 
          // with a unique of id of you guessed it, 'mySampleTable'
          var tbl = document.getElementById('mySampleTable');
          // grab how many rows are in the table
          var lastRow = tbl.rows.length;

          // if there's no header row in the table (there should be, code at least one 
          //manually!), then iteration = lastRow + 1
          var iteration = lastRow;
          // creates a new row
          var row = tbl.insertRow(lastRow);

          // left cell
          // insert a cell
        //  var cellLeft = row.insertCell(0);
          // here we're just using numbering the cell, like anything else you don't
          // have to use this, but i've kinda noticed users tend to like them
       //   var textNode = document.createTextNode(iteration);
          // takes what we did (create the plain text number) and appends it the cell
          // we created in the row we created. NEAT!
//cellLeft.appendChild(textNode);

          // right cell
          // another cell!
          var cellRight = row.insertCell(1);
          // creating an element this time, specifically an input
          var el = document.createElement('input');
          // a data type of text
          el.type = 'text';
          // the name of the element txtRow, and because this is dynamic we also
          // append the row number to it, so for example if this is the eigth row
          // being created the text box will have the name of txtRow8. super fantastic.
          el.name = 'txtRow' + iteration;
          // the exact same thing with a unique id
          el.id = 'txtRow' + iteration;
          // set it to size of 40. setting sizes is good.
          el.size = 40;

          // same thing as earlier, append our element to our freshly and clean cell
          cellRight.appendChild(el);

          // select cell
          // our last cell!
          var cellRightSel = row.insertCell(0);
          // create another element, this time a select box
          var sel = document.createElement('select');
          // name it, once again with an iteration (selRow8 using the example above)
          sel.name = 'selRow' + iteration;
          // crates options in an array
          // the Option() function takes the first parameter of what is being displayed
          // from within the drop down, and the second parameter of the value it is carrying over
          sel.options[0] = new Option('text zero', 'value0');
          sel.options[1] = new Option('text one', 'value1');
          sel.options[2] = new Option('text two', 'value2');
          // append our new element containing new options to our new cell
          cellRightSel.appendChild(sel);
		    el.size = 40;
     }

     function removeRow()
     {
          // grab the element again!
          var tbl = document.getElementById('mySampleTable');
          // grab the length!
          var lastRow = tbl.rows.length;
          // delete the last row if there is more than one row!
          if (lastRow > 2) tbl.deleteRow(lastRow - 1);
     }

</script>






<html>
     <head>
          <title>Page Title</title>
     </head>
     <body leftmargin="0" topmargin="0">
         

    <form action="addrow.html" name="eval_edit" method="post" format="html">
               <table align="center" width = "75%">
                    <tr>
                         <td align = "center">
                              click add to you know, add a row, and remove to remove a row, and submit to submit your page! whee!
                         </td>
                    </tr>
                    <tr>
                         <td align = "center">
                              <!--- very imporant to give the table an id --->
                              <!--- otherwise it won't know where to edit --->
                              <table border="1" id="mySampleTable">
                                     <tr>
                                        <td>
                                             Type of Leave
                                        </td>
                                        <td>
                                            No. of Days allowed
                                        </td>
                                      
                                   </tr>
                                   <!--- i create the initial row by hand, there are a lot of --->
                                   <!--- different ways to do this depending on what parsing --->
                                   <!--- language you use, i found this was easiest for the  --->
                                   <!--- snippet, but experiment, do your thing mang. --->
                                   <!--- this matches the same specs we laid out in the javascript --->
                                   <tr>
                                    
                                        <td><select name="selRow0">
                                                  <option value="value0">text zero</option>
                                                  <option value="value1">text one</option>
                                                  <option value="value2">text two</option>
                                             </select>
                                     </td>
                                        <td>
                                             <input type="text" name="txtRow1" id="txtRow1" size="40" />
                                        </td>
                                   </tr>
                              </table>

                              <!--- our buttons call our javascript functions when clicked --->
                              <input type="button" value="Add" onclick="addRow();" />
                              <input type="button" value="Remove" onclick="removeRow();" />
                              <input type="submit" value="Submit" />
                         </td>
                    </tr>
               </table>
  </form>
     </body>
</html>

Hi,

I am using this script which is nearly working correctly, but not quite!

When a user selects some text from the web-page and copies it,
the script is supposed to pick up the current web-page url and create a
resource box or credit line that is added to the selected text when the
data is pasted.

You will see that the meta keywords are used (randomly) as the anchor text
and this should be wrapped with the href= tags in order to create a link. Thats the bit that is not workink, but I can not see why.

Here is the complete script.




Code:

function init(){

// Options:
var useMetaKeyword = true; // Otherwise, page title
var minLength = 40; // Min selection chars
var useMetaAuthor = true; // Otherwise use domain
var addLinks = true; // Otherwise, just cite at end
var skip = new Array("home","link","click here"); // Don't link these (lowercase!)
	
function D(b,a,c){
 if(b.addEventListener)b.addEventListener(a,c,false);
 else b.attachEvent&&b.attachEvent("on"+a,c)}

function o(b,a){
 if(typeof b=="undefined"||b==null||!RegExp)return false;
   a=new RegExp("(^|\\s)"+a+"(\\s|$)");
 if(typeof b=="string")return a.test(b);
  else if(typeof b=="object"&&b.className)return a.test(b.className);return false}

function E(b,a){
 var c=false,j;
 for(j=b.parentNode;j!=undefined;){
  if(b.parentNode==e.body)break;
	else if(b.parentNode==a){c=true;break}j=j.parentNode}return c}

function F(b){
  return b.replace(/^\s*/,"")
	}

function G(b){
  return b.replace(/\s*$/,"")
	}

function H(b){
  return G(F(b))
	}

var I=new Array("home","link","click here"),
e=document,
x=window,
t=e.getElementsByTagName("body")[0],
p=e.getElementsByName("author"),
i=e.getElementsByName("keywords"),
q=x.location.toString(),
u=e.title.toString(),
d;if(!Array.indexOf)Array.prototype.indexOf=function(b,a){
  var c=-1;
	for(a=a|0;a<this.length||a==-1;a++)
	if(this[a]==b)c=a;return c};
	if(i.length>0&&useMetaKeyword){
	  i=e.getElementsByName("keywords")[0].getAttribute("content").split(",");
    u=Math.floor(Math.random()*i.length);
		i=i[u].replace(/^\s*|\s*$/,"")}
	else 
	  i=u;
		p=(p.length>0&&useMetaAuthor)?p[0].getAttribute("content"):e.domain;

var y="<p id='credit'><br/>Read more about <a href='"+q+"'>"+i+"</a> by <a href='http://"+e.domain+"' />"+p+"</a></p>";

if(/MSIE/g.test(navigator.userAgent))var v="msie";
else if(/Safari/g.test(navigator.userAgent))v="safChrome";
q=e.createElement("span");q.setAttribute("id","sasText");
t.appendChild(q);
d=e.getElementById("sasText");

posType=document.all&&!window.opera&&!window.XMLHttpRequest?"absolute":"fixed";
d.style.position=posType;
d.style.top="0px";
d.style.left="-9999px";
D(t,"copy",function(){d.innerHTML=y;
if(v=="msie"){
  for(var b=e.selection.createRange(),
   a=b.parentElement();
	 a.nodeName!="BODY"&&!o(a,"lbExclude");)a=a.parentNode;
	 if(o(a,"lbExclude"))return true;
	 a=e.body.createTextRange();
	 a.moveToElementText(d);
	 var c=b.duplicate();
	 c=c.htmlText;

if(c.length>minLength){
  d.id="tempSasText";
	d.innerHTML=c+y;
	(c=e.getElementById("sasText"))&&c.parentNode.removeChild(c);
	d.id="sasText";a.select()}}

else{b=x.getSelection();
  for(a=b.anchorNode;a.nodeName!="BODY"&&!o(a,"lbExclude");)a=a.parentNode;
	 if(o(a,"lbExclude"))return false;
	 if(b==""&&v=="safChrome"){
	   d.innerHTML=t.innerHTML;
		 a=document.createRange();
		 b.removeAllRanges();
		 a.selectNodeContents(d);b.addRange(a)}

else if(b.toString().length>minLength){
 var j=e.getElementById("credit");
 a=b.getRangeAt(0);
 c=a.cloneContents();
 d.id="tempSasText";
 d.insertBefore(c,j);
 (c=e.getElementById("sasText"))&&c.parentNode.removeChild(c);
 d.id="sasText";
 b.removeAllRanges();
 a.selectNode(d);
 b.addRange(a)}}
 
 var w=[];a=d.getElementsByTagName("a");for(b=0;b<a.length;b++)w.push(a[b].href);

if(addLinks){a=e.getElementsByTagName("a");
for(b=0;b<a.length;b++){var r=a[b].href;

if(w.indexOf(r)==-1)if(E(a[b],d)==false){
var f=H(a[b].innerHTML).toLowerCase();

if(skip.indexOf(f)==-1)
if((new RegExp(e.domain,"g")).test(r)){
var z=[];

function n(g,k,l){
 for(var A=g.childNodes.length;A-- >0;){
 var h=g.childNodes[A];
 if(h.nodeType===1)h.tagName.toLowerCase()!=="a"&&n(h,k,l);

else if(h.nodeType===3)
 for(var m=h.data.length;1;){
 m=h.data.lastIndexOf(k,m);
 if(m===-1||z.indexOf(k.toLowerCase())!==-1)break;
 var B=/\w/;
 if(h.nodeValue.charAt(m-1).match(B)||h.nodeValue.charAt(m+f.length).match(B))break;
 l.call(window,h,m)}}}

function s(g,k){g.splitText(k+f.length);
 var l=e.createElement("a");
 l.href=r;l.appendChild(g.splitText(k));
 g.parentNode.insertBefore(l,g.nextSibling);
 z.push(f.toLowerCase());
 w.push(r)}n(d,f,s);f=f.charAt(0).toUpperCase()+f.slice(1);n(d,f,s);
 f=f.toUpperCase();
 n(d,f,s);f=f.replace(/\w\S*/g,function(g){
 return g.charAt(0).toUpperCase()+g.substr(1).toLowerCase()});n(d,f,s)}}}}})}
 window.onload=init;

I have put the script on this page:
test page

To test it, just go to that page, highlight some text
(at least 40 characters) copy it, and then paste it
into your editor or notepad.

You can see that it is picking up some info and
writing the attribute line but it doesn't create the link

If it helps get it working, I am happy to slim the code
down by excluding some features.

Any ideas ?

I have no idea what to change in order to do this so I'm hoping someone can help

Basically this is a menu I have which I'm using in wordpress. Wordpress puts 'current' on the current page, so the menu knows which list item to keep highlighted.

On one of my pages however, it is hidden from the menu, therefor NONE of the list items contain 'current'. It makes the menu look bad when you are on this page.

What I'd like to do to this code, is add a very small feature that checks if none of the list items have 'current'. If none of the li's contain current, then just apply it to li:first-child (which is my home button).

I'm not familiar with javascript, but I feel that would be doable from just the script that I'm pasting below.


Code:

/**
 * LavaLamp - A menu plugin for jQuery with cool hover effects.
 * @requires jQuery v1.1.3.1 or above
 *
 * http://gmarwaha.com/blog/?p=7
 *
 * Copyright (c) 2007 Ganeshji Marwaha (gmarwaha.com)
 * Dual licensed under the MIT and GPL licenses:
 * http://www.opensource.org/licenses/mit-license.php
 * http://www.gnu.org/licenses/gpl.html
 *
 * Version: 0.2.0
 * Requires Jquery 1.2.1 from version 0.2.0 onwards. 
 * For jquery 1.1.x, use version 0.1.0 of lavalamp
 */

(function(jQuery) {
jQuery.fn.lavaLamp = function(o) {
    o = jQuery.extend({ fx: "linear", speed: 500, click: function(){} }, o || {});

    return this.each(function() {
        var me = jQuery(this), noop = function(){},
            jQueryback = jQuery('<li class="back"><div class="left"></div></li>').appendTo(me),
            jQueryli = jQuery("li", this), curr = jQuery("li.current", this)[0] || false;
			
			if (curr == false){jQuery(".back").remove();return false;}

        jQueryli.not(".back").not("#nav ul li").hover(function() {
            move(this);
        }, noop);

        jQuery(this).hover(noop, function() {
            move(curr);
        });

        jQueryli.click(function(e) {
            setCurr(this);
            return o.click.apply(this, [e, this]);
        });

        setCurr(curr);

        function setCurr(el) {
            jQueryback.css({ "left": el.offsetLeft+"px", "width": el.offsetWidth+"px" });
            curr = el;
        };

        function move(el) {
            jQueryback.each(function() {
                jQuery(this).dequeue(); }
            ).animate({
                width: el.offsetWidth,
                left: el.offsetLeft
            }, o.speed, o.fx);
        };

    });
};
})(jQuery);

Hi,

I want to add a cookie in this script to show the popunder once a day.
Can someone help me to change the following code to make it work ?

Code:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Popunder</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
</head>
<body>
<form id="popSubmit" action="http://www.google.com">
<input type="submit" />
</form>

<script type="text/javascript">
(function($) {

$.popunder = function(sUrl) {
var _parent = self;
var bPopunder = ($.browser.msie && parseInt($.browser.version, 10) < 9);

if (top != self) {
try {
if (top.document.location.toString()) {
_parent = top;
}
}
catch(err) { }
}


var sOptions = 'toolbar=1,scrollbars=1,location=1,statusbar=1,menubar=0,resizable=1,width=' + (screen.availWidth).toString();
sOptions += ',height=' + (screen.availHeight).toString() + ',screenX=0,screenY=0,left=0,top=0';


var popunder = _parent.window.open(sUrl, 'pu_' + Math.floor(89999999*Math.random()+10000000), sOptions);
if (popunder) {
popunder.blur();
if (bPopunder) {

window.focus();
try { opener.window.focus(); }
catch (err) { }
}
else {

popunder.init = function(e) {
with (e) {
(function() {
if (typeof window.mozPaintCount != 'undefined') {
var x = window.open('about:blank');
x.close();
}

try { opener.window.focus(); }
catch (err) { }
})();
}
};
popunder.params = {
url: sUrl
};
popunder.init(popunder);
}
}

return this;
}
})(jQuery);

$('#popSubmit').submit(function() {
jQuery.popunder('http://www.facebook.com');
});
</script>
</body>
</html>