View Single Post
Old 10-19-2010, 03:31 PM  
sortie
Confirmed User
 
sortie's Avatar
 
Industry Role:
Join Date: Mar 2007
Posts: 7,771
OK, now toggle the look of your button :

- You need to first move the "footerbutton" span tag above the script.
( it must be defined in your browser before the script can access it to load the
first button)

- I can delete the up arrows from the span tag since the script now loads it

- Now add the aqua colored line of code to the same script as above.


<span id=footerbutton style="position:fixed;right:0px;bottom:0px;backgro und-color:blue;border:solid red 1px;" onClick="footexpand();"></span>

<script type="text/javascript">
var mytog = 0;
var putback = document.getElementById("footer").innerHTML;
document.getElementById("footerbutton").innerHTML = "X";

function footexpand() {
if (mytog == 0) {
document.getElementById("footer").innerHTML = "";
document.getElementById("footerbutton").innerHTML = "^^";
mytog=1;
}
else {
document.getElementById("footer").innerHTML = putback;
document.getElementById("footerbutton").innerHTML = "X";
mytog=0;
}
}
</script>


I updated the demo to show this : http://ooaz.com/gfy/gfytest.html


To use an images instead of "X" and "^^"

Just change this "

document.getElementById("footerbutton").innerHTML = "X";

to this :

document.getElementById("footerbutton").innerHTML = "<img src=/images/closebutton.jpg border=0>";


And change this :

document.getElementById("footerbutton").innerHTML = "X";

To this :

document.getElementById("footerbutton").innerHTML = "<img src=/images/showbutton.jpg border=0>";


* making sure that any quotes in the HTML are single quotes, because double quotes
are already used. (this is interchangeable)
__________________
sortie is offline   Share thread on Digg Share thread on Twitter Share thread on Reddit Share thread on Facebook Reply With Quote