Member Avatar for sainiweb

Hi

I ahve this code which is working on Chrome, Firefox and Safari

But Its not working on IE

Can any one help me

<html>
<script type="text/javascript" language="javascript">
function set_padd(){
 var tt = document.getElementById("span_padding").innerHTML;
 var txt = new Array();
 txt = tt.split("<br>");  
 var atxt = '';
 for(var i = 1; i < txt.length;i++){
    if(txt[i].length > 0){
     atxt += '<a class="padd_txt" >'+txt[i]+'</a><br />';
    }
 }  
 document.getElementById("span_padding").innerHTML = atxt;
}
</script>
<style type="text/css">

.padd_txt{padding:7px;background:#009;color:#FFF;line-height:26px;font-size:14px;}

</style>

<body onload="set_padd();"  style="font-family:'Trebuchet MS', Arial, Helvetica, sans-serif; font-size:24px; line-height:1.2em">
<div style="width: 350px;">
  <p>
  <span id="span_padding" style="background-color: #009; color: #FFF;" class="blocktext">This is what I want to <br />
    happen where one<br />
    long string is wrapped  <br />
    and the text has this <br />
    highlight color behind <br />it.

</span>



</div> 
</body>
</html>
Edited by mike_2000_17 because: Fixed formatting
  • 2 Contributors
  • 2 Replies
  • 224 Views
  • 9 Hours Discussion Span
  • Latest Post Latest Post by sainiweb
Member Avatar for Graphix

- You need to use <BR> at the split():

- Also in order to get all the text, you need to set i = 0 in the for loop

The code:

<html>
<script type="text/javascript" language="javascript">
function set_padd(){
var tt = document.getElementById("span_padding").innerHTML;
var txt = new Array();
txt = tt.split("<BR>");
alert(txt);
var atxt = '';
for(var i = 0; i < txt.length;i++){
if(txt[i].length > 0){
atxt += '<a class="padd_txt" >'+txt[i]+'</a><br />';
}
}
document.getElementById("span_padding").innerHTML = atxt;
}
</script>
<style type="text/css">

.padd_txt{padding:7px;background:#009;color:#FFF;line-height:26px;font-size:14px;}

</style>

<body onload="set_padd();" style="font-family:'Trebuchet MS', Arial, Helvetica, sans-serif; font-size:24px; line-height:1.2em">
<div style="width: 350px;">
<p>
<span id="span_padding" style="background-color: #009; color: #FFF;" class="blocktext">This is what I want to <br />
happen where one<br />
long string is wrapped <br />
and the text has this <br />
highlight color behind <br />it.

</span>



</div>
</body>
</html>

~G

Member Avatar for sainiweb

the solution is

     <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>wrapped</title>

      <script type="text/javascript" language="javascript">

      function set_padd(){

      var tt = document.getElementById("span_padding").innerHTML;

      var txt = new Array();





   if (/MSIE (\d+\.\d+);/.test(navigator.userAgent)){ //test for MSIE x.x;
 var ieversion=new Number(RegExp.$1) // capture x.x portion and store as a number
 if (ieversion>=8)
  txt = tt.split("<BR>");
 else if (ieversion>=7)
  txt = tt.split("<BR>");
 else if (ieversion>=6)
  txt = tt.split("<BR>");
 else if (ieversion>=5)
  txt = tt.split("<BR>");
}
else
 txt = tt.split("<br>")


      var atxt = '';

      for(var i = 0; i < txt.length; i++){

      if(txt[i].length > 0){

      atxt += '<a class="padd_txt" >'+txt[i]+'</a><br />';

      }

      }

      document.getElementById("span_padding").innerHTML = atxt;

      }

      </script>

      <style type="text/css">



      .padd_txt{padding:7px;background:#009;color:#FFF;line-height:26px;font-size:14px;}



      </style>

      </head> 

      <body onload="set_padd();" style="font-family:'Trebuchet MS', Arial, Helvetica, sans-serif; font-size:24px; line-height:1.2em">

      <div style="width: 350px;">

      <p>

      <span id="span_padding" style="background-color: #009; color: #FFF;" class="blocktext">This is what I want to <br />

      happen where one<br />

      long string is wrapped <br />

      and the text has this <br />

      highlight color behind <br />it.



      </span>







      </div>

      </body>

      </html>

Thanx

Graphix

for help

Edited by mike_2000_17 because: Fixed formatting
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.