• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

Sliding Radio Buttons/Labels

New Here ,
Feb 27, 2019 Feb 27, 2019

Copy link to clipboard

Copied

Hello,

I'm Kim and I'm the guy who had the inquiry called "Kim's div tag discrepancy". The solution I received worked out fine. Thank you, Nancy. Later that week I was told by a programmer in another building that follows mac users that browsers seem to have this bad built-in habit of making in-coming  web sites bend to their preset framework preferences and, if you don't force them to reset, they create little anomalies in the structure of the pages in your site. To correct this you have to reset the browser. In the main.css line 1 will read @charset "UTF-8";   Line 2 will read /*CSS Document */   Line 3 (and this is the reset line) will read *  { margin:0px; padding:0px; border:0px; }  Line 4 (I leave blank)  and Line 5 will read   body { (and so on . .   This put all the elements on all layers back in alignment.

My next enigma concerns making a radio button slide in from the left side of the page into the near middle of the page and stop next to another radio button of reflecting design which came in from the right side of the page in the same manner and stopped to the right of the previous button. This action would be repeated below in like manner repeatedly until multiple buttons were listed in two reflective rows. When the came to rest the words or pictures above the lines would function as active radio buttons which, when pressed, would take the viewer to another page in the site. Below is a sample of an image that would enter from the left. Flip it horizontally and it would resemble it's right-sided counterpart which would enter from the right.

label.jpg The dark area behind the text will be transparent (I made it dark blue to show the white text and the line) and would move over a photograph of a building interior as it proceeded to the right. The photograph would be the "radio button" to the page "Recruiter Spotlight". Most of the images will simply be a line of white text over a white line that will enter from the left and right and settle on the page somewhat as shown below:

list.jpg  They will enter the page somewhat like a zipper when the named anchor for the section is selected at the top of the page. When the section is abandoned the section will empty of its labels until it is accessed again.

Thank you for your time and patience and, if any of you might have a way out for me I sure would appreciate an answer to this one. It.s got me baffled for now.

Until then, thank you for all you do and have a great week!

Kim

Views

602

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Community Expert , Feb 27, 2019 Feb 27, 2019

#1 there are lots of ways to reset CSS.  Every framework has at least 1 CSS reset in its code.   The wildcard (asterisk) method is regarded by some  as a "sledgehammer to swat flies" approach.  See link below for more on CSS Resets.

Reboot, Resets, and Reasoning | CSS-Tricks

#2  Look at WOW.js for the animations.

https://wowjs.uk/

Votes

Translate

Translate
Community Expert ,
Feb 27, 2019 Feb 27, 2019

Copy link to clipboard

Copied

LATEST

#1 there are lots of ways to reset CSS.  Every framework has at least 1 CSS reset in its code.   The wildcard (asterisk) method is regarded by some  as a "sledgehammer to swat flies" approach.  See link below for more on CSS Resets.

Reboot, Resets, and Reasoning | CSS-Tricks

#2  Look at WOW.js for the animations.

https://wowjs.uk/

Nancy O'Shea— Product User, Community Expert & Moderator
Alt-Web Design & Publishing ~ Web : Print : Graphics : Media

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines