×
Community Rules
This comm is open to anyone to post codes, layouts, resources, tutorials, and requests for help and content. Of course, we do have some rules, so please read through them before jumping in; thank you!
■
Treat others the way you'd like to be treated. This is not a drama comm, and we expect you guys to be awesome and stay civil. If a situation gets out of hand, please contact a mod, and leave comments intact so we can accurately handle the situation.
■
Please tag your posts and check out the
tagging guide if you have any questions!
■ Very long posts or posts formatted with your own div styling for organization should be behind a cut to save people's f-lists.
■
Work safe above the cut, please!
■ If posting codes, guides, etc. absolutely
do not post content that you did not make. That's stealing, and it's super uncool, bro! If you are posting expanded/edited codes made by yourself using another user's coding as well, please be sure you have their permission (You do not need direct permission if they allow edits to be re-posted in their blanket rules.)
■ Do not post tutorials/links to tutorials that show people how to steal codes from other users. Again:
Stealing. Not cool.
■
When asking for help with something, please check the help tags (
help: coding, help: graphics, help: icons, help: layouts, help: other) first to see if your question has already been posted and answered to avoid duplicates.
■
We do not allow game ads to be posted on this comm since there are so many communities specifically for that already; if you're pimping a game as an addition to a regular post, that's fine. (OK: You post an RP code and mention in the post, oh hey, also I'm running this game! NOT OK: Posts dedicated to game promo.)
■
We do allow other types of community promos if they are related to RP (icon comms, other types of resource comms, etc.) Just shoot us a comment in our dropbox beforehand and we'll let you know if it's cool to post!
![[info]](https://www.insanejournal.com/img/userinfo.gif){kind=small}
![[info]](https://www.insanejournal.com/img/community.gif){kind=small}
Comments
Basically I want to take this java code and make it appear for specific pages etc
https://stackoverflow.com/questions/435
First I'll make a div with a class and an ID. So for example,
div class="page" id="info1"And then in the CSS I'll do:
.page{display:none;}.page:target{display:block;}
And the rest is just styling! You'd call this page (or pages) with a standard link tag, but with
#info1for thehref, just like an anchor link (because that's secretly all it is LOL.) The reason I do it as a class/ID combo is because if I have multiple popups I only need to code the show/hide for one spec, and then if I have styling specific to just one of them I can do that in the ID styling instead if needed.The reason you can't do this in S2 without using an existing container that has an ID is because you can't create new IDs in S2 outside of theme layers (only new classes) and you have to have an ID to trigger a target link such as
#info1since there's no such thing as targeting via.info1.I also use this method for non-popups, like this. The popup is really just how you choose to show/hide the info; you can use this method for sliding content etc too.
You also likely won't be able to do this in S2 outside of a paid/perm account with theme layers, but since you're on S1 Generator atm, you can do something in there! In the area where your custom coding goes you'd want something like this for each page:
<section id="name1" class="page">CONTENT
</section>
And then in the CSS you'd have:
.page{visibility:visible;display:none;}.page img{display:inline;}
.page:target{display:block;}
And then any styling you want ALL pages to have would go into
.pageand if you have any styling specific to certain pages, like if you want the bold tag to do something different on only the second page, you'd put that into the CSS for#name2 bWhen done this way, you can link to each page by using the ID, ex.
><a href="#name1">to switch them fromdisplay:none;todisplay:block;(you'll just want to make sure the nav for these isn't in one of the pages or they won't be accessible.)