PDA

View Full Version : making words(text) vertically

joonstar
04-19-2003, 02:26 AM
I like to make words vertically.

For example,

not "12345"

But

1
2
3
4
5


If I make the "width" of a <td> very narrow, I can do this.

But the number of the vertical words are varied because they are "valuables".

The narrowing of the width approach has a critical problem, i.e. it
can't be vertically aligned in the middle.

I think there might be a code for making words vertically.
Mhtml
04-19-2003, 03:21 AM
Well I had a go at it, I couldn't seem to get ubound to work on the array so I'll leave it to someone else to work out a better way.

But what I did was basically grab all the text in the element and then I split it up sending each letter into the array and then I just print them to the screen again with a line break after each letter.

The good thing about the way I did it is that you can type the text like normal and then just run an onload event to verticalize 'em all.


<div id="textual">hello</div>
<script>
function vertText(){
var verty = document.getElementById('textual').innerHTML
verty = verty.split("")
var vertBound = 4 // Here is where the ubound would go if I could figure out how to use it! verty.ubound() doesn't work.
var i =0;
while(i <= vertBound){
document.getElementById('textual').innerHTML += verty[i]+'<br>';
i++;
}
}

</script>
joonstar
04-19-2003, 04:58 AM
I had two tests with your code.

(test1)

<div id="textual">hello</div>
<script>
function vertText(){
var verty = document.getElementById('textual').innerHTML
verty = verty.split("")
var vertBound = 4 // Here is where the ubound would go if I could figure out how to use it! verty.ubound() doesn't work.
var i =0;
while(i <= vertBound){
document.getElementById('textual').innerHTML += verty[i]+'<br>';
i++;
}
}

</script>


(test2)

<script>
function vertText(){
var verty = document.getElementById('textual').innerHTML
verty = verty.split("")
var vertBound = 4 // Here is where the ubound would go if I could figure out how to use it! verty.ubound() doesn't work.
var i =0;
while(i <= vertBound){
document.getElementById('textual').innerHTML += verty[i]+'<br>';
i++;
}
}

</script>
<body onload=vertText()>

<div id="textual">hello</div>



The result of (test 1);

hello


The result of (test 2);

helloh
e
l
l
o

(Test 1) is not vertical

The unwanted letters "helloh" are showed up.
How can I remove "helloh"

and
Do you have better one to excute of the function vertext instead of <body onload=vertText()>?
Mhtml
04-19-2003, 05:14 AM
The reason why the first one stayed horizontal is because you didn't call the function.

<script>
function vertText(){
var verty = document.getElementById('textual').innerHTML
verty = verty.split("")
var vertBound = 4 // Here is where the ubound would go if I could figure out how to use it! verty.ubound() doesn't work.
var i =0;
while(i <= vertBound){
if(i==0){
document.getElementById('textual').innerHTML = verty[i]+'<br>';
}else{
document.getElementById('textual').innerHTML += verty[i]+'<br>';
}
i++;
}
}

</script>


Ok modified the code a little, it should fix the horizontal and vertical problem.
joonstar
04-19-2003, 06:20 AM
Thank you
ahosang
04-19-2003, 11:26 AM
<script>
function vertText(){
var str="";
var verty = document.getElementById('textual').innerHTML
verty = verty.split("")
for (i=0;i<verty.length;i++) {
str+=verty[i]+"<br>";
}
document.getElementById("textual").innerHTML=str;
}
</script>
eggman
04-19-2003, 03:31 PM
<script>
function vertText()
{
with(document.getElementById('textual'))
innerHTML=innerHTML.split("").join("<br>")
}
</script>
Mhtml
04-20-2003, 03:10 AM
There you go, some people who know what they're doing showed up..