Original Concept Character Sheet (help me fix a bit of mess)

Hey guys, I've been working on this sheet and have run into a bit of a wall in term of fixing my own problems. I am only self taught with HTML and CSS with most of my knowledge coming from roll20 and basic free courses online. I have managed to get the basis of my concept but the functionality of certain areas are too far out of my scope and I am failing to find answers anywhere that I either understand or work (or both). I have uploaded the HTML and CSS to codr. I do apolgise for the untidiness of my sheet, its a mess and I am slowly trying to tidy it up. Things I need to fix; 1. Got Skillz - I have tried to create a hide/show for the tickbox, to show/hide the two buttons. I am not sure if my solution works. 2. Sliders - I'd like the sliders to show the numeric value on the slider and also to memorize the position when the sheet is closed 3. Occupations - I need a fix for the opacity and focus on the box, also need to hide unselected choices one a both is checked. 4. Weapons - Buttons to work with selected damage dice and stat modifiers. 5. Ranged weapons - When the attack button is click the same amount as the Clip value the loaded checkbox unchecks (or another loading solution) There is probably a heap of other things that could be fixed that I just don't get and would appreciate any help. Codr link

0. You can test your sheet by choosing the "Custom" option for sheet under game settings and copying in HTML & CSS - then you can test to what extent your solution works. Your Github link seems nonfunctional. 1. Using the above, you should be able to see if your solution works. The  wiki has information on how to do showing/hiding section based on a checkbox. 2. The only type of inputs that works on roll20 (in the sense of saving their value to an attribute) are number, text, checkbox, radio, and hidden, as well as textareas. You won't be able to use sliders on a character sheet. 3. - 4. Don't know what you're trying to do, can you give an example/explanation in this thread? 5. You want to change a value on the character sheet when a roll button is clicked (so a button that sends the attack to chat)? That's only possible using API scripts.

Thank for your response. I have updated the link with other site, my apologies for the mix up. 1. I have been using the Wiki as a source for information and have impilmented the hide/show but am having some trouble with it and am unable to see where I have gone wrong. 2. Thats a bit of a bummer, but I guess I will have to use a number input instead. 3. What I have created is a drop down box, when a button is hovered over. Inside the dropdown is a checkbox selection of occupations and their archtypes. However the dropdown box has bad visibility. Within the said box I also need to implement a hide/show (but I can probably do that myself once I figure out what I am doing wrong with #1). 4. Make a macro button that takes input values and adds them to a roll. [[1d20 + @{str} + @{damagedice}]]... Its probably my syntax or class naming is wrong. 5. I figured it would be asking a lot of HTML to do it. Back to the drawing board for that one.

1. Your showing/hiding for e.g. the skill buttons does not work because the checkbox and the  button are not siblings (they're not children of the same td element). It works in the occupation box. You can still  make it work by duplicating inputs with the same name and hiding them in front of the buttons... but that brings us to...  1b. None of your skill checkboxes seem to have a name="attr_something" associated to them. Their state will not be stored when reopening the sheet. In fact, most of the inputs on your sheet don't have a name. They need one, otherwise, they're useless. 3. It seems you have a CSS rule table.sheet-dettab { opacity: 0.6} which badly impacts the readability of everything and also makes your hover box malfunction when it is on top of something else. I would remove that rule completely. There's no reason to make everything partially transparent. 4. It should work like this. Just make sure to use the right attribute names. For example, your strength input is name="attr_stre" (terrible choice in my opinion, use either attr_str or better attr_strength), so you would have to use @{stre}.

Thanks heaps Jakob. Your advice is greatly appreciated. It has fixed all my problems.