[Help] HTML "Show More Content"

Wiredex · Dec 25, 2010

Hey guys, take a look at this following website

You must be registered to see links

How do i make the "Show more Music Release" button?
Where on click it will show more posters and hide the button?

Any idea anyone?

Aaron · Dec 25, 2010

Look at their source and figure it out. Damn.

Wiredex · Dec 25, 2010

Don't be a smartass. It's either you help or you stfu. And don't think i didn't do that before i came asking for help.

foxx · Dec 25, 2010

Wiredex said:
Don't be a smartass. It's either you help or you stfu. And don't think i didn't do that before i came asking for help.

no u..

4. Include enough information
Make sure you paste relevant code, indicate what you tried already, etc. If we have to guess what help you want it'll take a lot longer before we can help you!

5. Don't just dump your problem and hope we sort it out for you!
Coders section is not a general 'I need something fixed so lets ask you guys to fix it for me' forum! If you have a specific problem, for instance a typecast that's giving you trouble or a regex that's not working correctly, feel free to ask. But do not dump here 50 lines of code with the message 'its not working, fix please', or expect us to write your scripts for you!

6. Do not ask stupid questions!
Contrary to popular believe, there are such things as stupid questions. If we feel you could have answered your problem yourself with 5 minutes searching or reading a manual, you will get an infraction!

jMerliN · Dec 25, 2010

I believe this qualifies as a question without enough information, a problem that hasn't been properly researched first (ie, he dumped it here), and probably a stupid question.

Oh poop. Evil cat is right.

SaintsIan · Dec 25, 2010

Button on click -> Hide button + Show hidden list items -> ??? -> Profit.

You must be registered to see links

Evil cat is right.

Aaron · Dec 25, 2010

Wiredex said:
Don't be a smartass. It's either you help or you stfu. And don't think i didn't do that before i came asking for help.

It's either you try, and attempt people will help you or stfu. And don't think I believe that you tried before you came asking for help.

Wiredex · Dec 25, 2010

That's what you believe. Believe me, i tried my fair share.
Viewing source doesn't help because i did that and it didn't help.
Searching on google without relevant keywords lead me to nowhere.

BrightChoco · Dec 25, 2010

The show more music button isn't HTML. That's JavaScript. To do it you'd need to have something like.

Code:

<html>

<head>
<script type="text/javascript">
function showMore()
{
 var d = document;
 d.getElementById("more").style.display = "block";
}
</script>
</head>

<body>
<div id="show_more" onClick="showMore();">Show More</div>
<div id="more">More Music</div>
</body>

</html>

and the css for the "more" will be "display:none;" or something. That's just basic, if you wanted to add more effects like a fade or something you'll need to code that in yourself. I will not code that in for you.

Wiredex · Dec 25, 2010

Thanks i got it working, but how do i make the button disappear after clicking?

jMerliN · Dec 25, 2010

BrightChoco said:
The show more music button isn't HTML. That's JavaScript. To do it you'd need to have something like.

Code:

<html> <head> <script type="text/javascript"> function showMore() { var d = document; d.getElementById("more").style.display = "block"; } </script> </head> <body> <div id="show_more" onClick="showMore();">Show More</div> <div id="more">More Music</div> </body> </html>

and the css for the "more" will be "display:none;" or something. That's just basic, if you wanted to add more effects like a fade or something you'll need to code that in yourself. I will not code that in for you.

Don't do this manually. Use a DOM manipulation framework.

Wiredex said:
Thanks i got it working, but how do i make the button disappear after clicking?

He already said how.

foxx · Dec 25, 2010

BrightChoco said:
The show more music button isn't HTML. That's JavaScript. To do it you'd need to have something like.

Code:

<html> <head> <script type="text/javascript"> function showMore() { var d = document; d.getElementById("more").style.display = "block"; } </script> </head> <body> <div id="show_more" onClick="showMore();">Show More</div> <div id="more">More Music</div> </body> </html>

and the css for the "more" will be "display:none;" or something. That's just basic, if you wanted to add more effects like a fade or something you'll need to code that in yourself. I will not code that in for you.

html allow only one id(read ids must be unique) on page though, so this wouldn't really work if he had multiple hidden elements just like they have

---------- Post added at 08:57 PM ---------- Previous post was at 08:51 PM ----------

also yea,

You must be registered to see links

BrightChoco · Dec 25, 2010

If he had multiple hidden elements he would simply just add the following for as many divs as he wanted to the function LOL...

Code:

d.getElementById("[I][COLOR="Red"]the div id[/COLOR][/I]").style.display = "block";

foxx · Dec 26, 2010

You realize that if he added what you suggest I'd show/hide all divs after clicking on just one "show more" button, right.

And even if you meant is as creating the showMore() function for each div he'd want to show/hide, it's retarded.

Such an "elegant" and "flexible" way of coding heh.

GeNyaa · Dec 26, 2010

foxx said:
You realize that if he added what you suggest I'd show/hide all divs after clicking on just one "show more" button, right.

And even if you meant is as creating the showMore() function for each div he'd want to show/hide, it's retarded.

Such an "elegant" and "flexible" way of coding heh.

true... but it's an good basic.

s-p-n · Dec 26, 2010

Code:

function switcher(id) {
    element = document.getElementById(id);
    if(element.style.display != "none")
    {
        element.style.display = "none"
    } else {
        element.style.display = "block"
    }
}

Code:

<div id="show_more_music" onclick="switcher('show_more_music');switcher('more_music')">Show More Music...</div>

<div id="more_music" style="display:none;">
I contain more music....
</div>


<div id="show_more_movies" onclick="switcher('show_more_movies');switcher('more_movies')">Show More Movies...</div>

<div id="more_movies" style="display:none;">
I contain more movies....
</div>


<div id="show_more_books" onclick="switcher('show_more_books');switcher('more_books')">Show More Books...</div>

<div id="more_books" style="display:none;">
I contain more books....
</div>

Good?

foxx · Dec 26, 2010

You must be registered to see links

good

[Help] HTML "Show More Content"

Wiredex

Master Summoner

Aaron

ex visor

Wiredex

Master Summoner

foxx

Hm.

jMerliN

Ginger by design.

SaintsIan

Mother effin' clouds

Aaron

ex visor

Wiredex

Master Summoner

BrightChoco

Newbie Spellweaver

Wiredex

Master Summoner

jMerliN

Ginger by design.

foxx

Hm.

BrightChoco

Newbie Spellweaver

foxx

Hm.

GeNyaa

Custom Title Activated

s-p-n

:-)

foxx

Hm.

About Us

Online statistics

Forum statistics

RaGEZONE Sponsor