Use div or span to segregate the parts.
E.g.
<div id="para1">
paragraph one stuff
<a
href="javascript:doHide();doShow(2);">Next</a>
</div>
<div id="para2" style="display: none;">
paragraph two stuff
<a
href="javascript:doHide();doShow(3);">Next</a>
</div>
<div id="para3" style="display: none;">
paragraph three stuff
</div>
<script language="Javascript">
function doHide() {
var x=document.getElementsByTagName("div");
for (y = 0; y < x.length; y++) {
if (x[y].id.indexOf("para") == 0) {
x[y].style.display = "none";
}
}
}
function doShow(myid) {
if (document.getElementById("para" + myid)) {
document.getElementById("para" + myid).style.display = "";
}
}
</script>
i tried it on a text file and converted it to a html it works.
but when i tried on blogger it doesn't work. :-(
the hide function also doesn't work. :-(
below is my coding, please help to look through it and advice me
on the coding for the show and
hide.
----------------------------------------------------------------------------------------------------------
<div id="para1">
paragraph one stuff
<- to be displayed
always
<a
href="javascript:doHide();doShow(2);">Click here to read
more</a>
</div>
<div id="para2" style="display: none;">
paragraph two
stuff <- to hide until
until users click to open
</div>
<script language="Javascript">
function doHide() {
var x=document.getElementsByTagName("div");
for (y = 0; y < x.length; y++) {
if (x[y].id.indexOf("para") == 0) {
x[y].style.display = "none";
}
}
}
function doShow(myid) {
if (document.getElementById("para" + myid)) {
document.getElementById("para" + myid).style.display = "";
}
}
</script>
where to put the "click
here to hide"?
