It is unclear what you are trying to do as you are using the checkbox/radio hack to hide and show elements and usually you would hide the radio button from sight while doing this.
If you want to show the radio input in the label field then you will need to place it there absolutely and set its display to block as mentioned by TechnoBear above. You will also need to set a stacking context for the absolute child by making the parent div position:relative.
@PaulOB Thank you, I want to create a expandable radio same to same like the Amazon welcome screen but I try to search the script which related to this but I can’t find on Google. What would be code like this?
They both have the same function but are just styled a little differently. It should be a relatively easy matter to put your form elements inside the code I posted and add a bit of styling to match the amazon example?
What is is exactly that you can’t do?
The thread was about adding a radio button which I have shown one way for you to do it. You could indeed style the radio button differently if you styled an inner element of the label instead.
Here’s a start:
Mights it’s funny but css accordion is too fast and not works pretty. Might you understand what’s I am saying. Thanks to @PaulOB, who’s provide the script of front look.
Wouldn’t it make sense to simply swap the content over? It seems more logical to have the first option open by default, rather than the second, so just put the log-in information first and the sign-up option second.
If you are talking about the jQuery version and you don’t want the slideDown() or slideUp() then change those rules in the js to show() and hide() respectively. (Refer to the jQuery documentation for more info).
Show() and hide() happen instantly but I think it will be a big mistake for accessibility because users may not realise what just happened when it’s instant. It’s like jumping to a new part of the page instantly and this more often than not confuses users.
The slideDown and slideUp give visual cues and allow the user to easily spot what has changed.