Shoutbox

Html help - Printable Version

-Shoutbox (https://shoutbox.menthix.net)
+-- Forum: MsgHelp Archive (/forumdisplay.php?fid=58)
+--- Forum: Skype & Technology (/forumdisplay.php?fid=9)
+---- Forum: Tech Talk (/forumdisplay.php?fid=17)
+----- Thread: Html help (/showthread.php?tid=46350)

Html help by absorbation on 06-15-2005 at 04:06 PM

Ok before you ask i have searched for it :P But i want to know how to make a table dropdown text page. That's why i havnt found it :S

Well i dont know what to call it but http://www.stuffplug.com/?act=features seems to give an idea what i'm going on about.

http://www.msgstuff.com/links.html i want the subtitles to be clicked and when they are clicked they show their links and when clicked again they hide them :P

Does anyone know the code for this :S

Thanks :)

Edit: Fixed some spelling


RE: Html help by Veggie on 06-15-2005 at 04:15 PM

Did you at least _try_ to do this before asking here? i have the JS source to hide and display elements but you just wont learn anything if i give it too you, google show and hiding divs using javascript theres hundreds of pages on it.


RE: Html help by Dempsey on 06-15-2005 at 04:17 PM

yea i agree with Veggie you should at least try it yourself before asking for it ready made, cos tbh your new site wont really be yours, all you would have done on the site is just put togther lots of scripts and code written by other people lol :p


RE: Html help by absorbation on 06-15-2005 at 04:18 PM

I have i've searched and looked at the sorce from a few websites but it never goes well.

*absorbation feels silly because veggie is the one that is always trying to get me do my own scripting :S

I hope that is not another classic quote :P

Give me the sorce if you can and thanks :)

Edit: I's only a basic code to make text show different things on a text click. Look at the links page it's a basic code i thought :P


RE: Html help by Veggie on 06-15-2005 at 04:28 PM

If its only a basic code then whats the problem?





RE: Html help by absorbation on 06-15-2005 at 04:29 PM

quote:
Originally posted by Veggie
If its only a basic code then whats the problem?

I have know idea what the code is, even the basics is it html or java? :$
RE: Html help by Veggie on 06-15-2005 at 04:33 PM

http://www.netlobo.com/div_hiding.html

First google result...


RE: Html help by Matti on 06-15-2005 at 04:33 PM

Me 2 the resque!

Put this in the <head> section:

code:
<script language=JavaScript>
function expand(thistag) {
   styleObj = document.getElementById(thistag).style;
   if (styleObj.display=='none') {styleObj.display = '';}   /when it's already invisible, make it visible again
   else {styleObj.display = 'none';}   /else, make it invisible
}
</script>
Now, place ur hided things in a <div>, like this:
code:
<div id="hide01" name="hide01" visibility="hidden"> ... </div>

The text which needs 2 show/hide it, should have 2 look like this:
code:
<a href="javascript:expand('hide01')">Show/hide thing</a>
And 2 make the <div> disappears when the page loads, add this to the <body> tag:
code:
<body onload="expand('hide01')">

And ur done! U can make more hided div's, just call them hide02 or something, make a link and add it back to the <body> onload!
Otherwise, it will appear when the page shows up.

Example (my site)
(I) On that page, there's also a [+] to [-] change when click. Check the script, and may the source be with you! ;)
RE: Html help by Veggie on 06-15-2005 at 04:35 PM

Thats a terrible way of doing it! dont hide the content using a onload use a css display:none

In the <head>

code:
<javascript>
    function hide(obj)
    {
        var ele = document.getElementById(obj);
        var style = ele.style;
        var img = "img"+obj;
        var currentStyle = ele.currentStyle || window.getComputedStyle(ele, null);
        if (currentStyle.display == "none"){
            style.display = "block";
            document.getElementById(img).setAttribute('src','images/opentriangle.gif');
            }
        else{
            style.display = "none";
            document.getElementById(img).setAttribute('src','images/triangle.gif');
            }
    }
   
</javascript>


code:

<a href="#" onclick="javascript:hide('templates');return false;"><img src="images/triangle.gif" id="imgtemplates" border="0"> Templates:</a>

<div id="templates" style="display:none">
Content that hidden
</div>

Not sure if it will work as its taken out of my site....
RE: Html help by Ezra on 06-15-2005 at 09:50 PM

<javascript> doesn't excist :S

it's

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

EDIT: The script does work btw (Y)


RE: RE: Html help by Veggie on 06-16-2005 at 06:36 AM

quote:
Originally posted by Ezra
<javascript> doesn't excist :S

it's

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


Yeah i know im lazy, just had too type that in as its in my javascript.php file so that script include wasent there...
RE: Html help by absorbation on 06-16-2005 at 02:55 PM

I've dont it now thanks check the links and help pages at http://www.msgstuff.com to see what i wanted i just robbed the sorce from stuffplug in the end :S

<script language="Javascript">
var cursel=0;


function openfeature(id) {
  if (cursel>0) {
    document.getElementById("feature"+cursel).className="feature";
    document.getElementById("feature_desc"+cursel).style.display="none";
  }
  cursel=id;
  if (cursel>0) {
    document.getElementById("feature"+cursel).className="feature_selected";
    document.getElementById("feature_desc"+cursel).style.display="block";
  }
}


</script>

<a name="entry12"></a>

<div class="feature" id="feature12" onClick="return openfeature(12);"><div class="featurepadding">
<div class="title"><b><u>Msn Messenger Links:</u></b></div>

Msn messenger links to get your plugins display pictures and smiles

</div></div>

<div class="feature_desc" id="feature_desc12" style="display: none"><div class="featurepadding">

<br>

<a href="http://www.mess.be" target=_blank><img src="images/mess.gif" border=0></a>
<a href="http://www.messengermad.com" target=_blank><img src="images/messengermad.jpg" border=0></a>

<a href="http://www.messengerdiscovery.com" target=_blank><img src="images/messengerdiscovery.gif" border=0></a>
<a href="http://www.msgshit.com" target=_blank><img src="images/msgshit.jpg" border=0></a>
<a href="http://www.sherv.net" target=_blank><img src="images/sherv2.gif" border=0></a>
<a href="http://www.emoticon-maker.net" target=_blank><img src="images/emoticonmaker.gif" border=0></a>
<a href="http://www.ilovemessenger.com" target=_blank><img src="images/lovemessenger.gif" border=0></a>
<a href="http://www.msnfanatic.com" target=_blank><img src="images/msnfanatic.gif" border=0></a>

<br>
<br>

<a href="http://www.winks.cc" target=_blank><img src="images/winks.jpg" border=0></a>

</div></div>

That's a bit of the sorce if anyone wants to use it ;)


RE: Html help by Veggie on 06-16-2005 at 04:58 PM

Stealing peoples code is bad :notfunny:


RE: Html help by absorbation on 06-16-2005 at 04:59 PM

quote:
Originally posted by Veggie
Stealing peoples code is bad :notfunny:

Well i really dont think he wrote it from scrach it is just using <div> tags and a bit of javascript ;)
RE: Html help by Ezra on 06-16-2005 at 06:52 PM

You should add this to those links

code:
onMouseOut="document.body.style.cursor='arrow'" onMouseOver="document.body.style.cursor='hand'"

It makes it look like a link a little more (doesn't work properly in FF, but it works perfectl in IE :))
RE: Html help by absorbation on 06-16-2005 at 06:58 PM

I'll make a style sheet for it later ;)