show/hide content on click with js

[Shikkediel]

Nice looking site there, funk.

I’m assuming the approach with the element index (order) isn’t much of a problem when it comes to the buttons, just the related content which you’d like to randomise?

[Funkaholik]

thanx ..)
a bit blank but way more serious then previous version.

about menu i’m just thinkin on how to apply that method in future but i hope you’ll help me out with this if there will be a need.,)
plus i kinda get it and took up arms.

but currently i’m having huge problems with Safari as always (Safari have more bugs then ie))
icons doesn’t centered and not always visible
plus that HEX envelope that i used – very nice lookin icon .. it makes me feel so good
but even after that method
some mobile browsers render it into some red nose clown $#@% so i don’t have that much love to it

i remember that you’re a on Firefox
thinkin to install virtual ios so i could debug it by myself

[philipca]

Hello. My name is Philip Caplan and I read the article:
https://css-tricks.com/exposing-form-fields-radio-button-css/
and used what I could figure out from reading this forum discussion to create a small demo of an idea that I was trying to prototype which needs a form of the ‘reveal’ idea described.

Can you help me (as a very, very beginner in this stuff!) to get the 2 Changes described below to my code.

A demo that I have been able to put together can be seen at http://www.com-uk.org/numenu/index.html
and in a Codepen called ‘test1’ — my username is philipca (but I don’t know how to get the actual URL of that Codepen!!)

How the demo works now: clicking the “TEXT” radio button in the group works mostly as I want it to:
— it reveals a ‘second row’ of 4 radio buttons (Heading/Sub-heading/Intro para/Normal para) with beneath that a textarea.

At present, selecting the other 3 radio buttons (IMAGE/LINK/BUTTON) produces the same ‘second row’ as TEXT.

(CHANGE 1) I want to have a different ‘second row’ to be revealed when each of IMAGE, LINK or BUTTON is selected.

At present, the textarea is revealed at the same time as the ‘second row’.

(CHANGE 2) I want it NOT to appear until a selection is made from the ‘second row’, at which time it is revealed in a ‘third row’.

Note: there won’t always be 4 radio buttons in each row: sometimes there may be more or less.
And sometimes there may be some radio buttons as a ‘third row’ with a textarea or some other input as a ‘fourth row’.

[Funkaholik]

for CHANGE 1 you have to make 3 more divs with different content it them
and you’re missing closing tag < /div > for that class in your html by the way)

and CHANGE 2 is impossible to do because you have your second row of radio buttons inside
div which only appears when one of a radio buttons from the first row is selected

make a codepen so we could play around with it a bit.,)

[Shikkediel]

It might’ve been better to start your own topic for this, @philipca…

[philipca]

I made a codepen called test1, but I don’t know how to find its URL!
My username is obviously ‘philipca’ so I tried:
codepen.io/philipca/pen/test1
but that gives a 404 Error.

Can you tell me how to find the URL of a codepen I have created, please….

[Shikkediel]

Go to your main page… then select the pen. ;-)

http://codepen.io/philipca

http://codepen.io/philipca/pen/PpbQxv

To embed, use the address in the url bar.
Do start your own topic though…

[Author]

Posts