low fidelity
ππππΎπ½ ππ π£πͺπ³π΅π© π°π§ π·π¦π―πΆπ΄
hellooo, here i am again asking for help from the coding gurus !!
i'm currently working on an in-character code, but i have an idea that i'm not sure how to execute, and i can't seem to really find resources on how to do it. if you can't tell already, i'm suuuper new to coding ^^"
what i'm trying to do for this code is have a hover-over to reveal the entirety of it. something like an all-white background, with a photo centered in the middle, and text over that image.
is there anybody who could help me understand how to create a hover? please and thank you!
here is the code btw if anyone wants to take a peek. xo
i'm currently working on an in-character code, but i have an idea that i'm not sure how to execute, and i can't seem to really find resources on how to do it. if you can't tell already, i'm suuuper new to coding ^^"
what i'm trying to do for this code is have a hover-over to reveal the entirety of it. something like an all-white background, with a photo centered in the middle, and text over that image.
is there anybody who could help me understand how to create a hover? please and thank you!
here is the code btw if anyone wants to take a peek. xo
Code:
[nobr]
[class=backg]
position: relative;
box-sizing: border-box;
width: 700px;
height: 500px;
background-color: #bdbdbd;
overflow: hidden;
margin-right: auto;
margin-left: auto;
padding: 0;
[/class]
[class=textbox]
position: relative;
overflow: auto;
width: 475px;
height: 473px;
font-size: 11px;
line-height: 12px;
color: #000;
font-family: Arial;
padding: 5px;
text-align: justify;
[/class]
[class=textboxcontainer]
position: absolute;
overflow: hidden;
width: 467px;
height: 473px;
left: 215px;
top: 10px;
background-color: #fff;
[/class]
[class=sidebar]
position: absolute;
overflow: visible;
width: 199px;
height: 485px;
left: 8px;
top: 7px;
background: url('https://i.ibb.co/SPbppVn/cutejude.png');
background-size: 120%;
[/class]
[class=sidebartext]
position: absolute;
left: 12px;
top: 290px;
overflow: visible;
width: 180px;
height: 180px;
text-align: left;
font-family: Arial;
font-style: normal;
font-weight: normal;
font-size: 10px;
color: #000;
border: solid #000 1px;
padding: 5px;
[/class]
[div class=backg]
[div class=textboxcontainer][div class=textbox]Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Iaculis urna id volutpat lacus laoreet non curabitur gravida. Donec ultrices tincidunt arcu non sodales neque sodales ut. Lectus arcu bibendum at varius vel. Lacus sed turpis tincidunt id. Posuere ac ut consequat semper viverra nam libero. Consequat mauris nunc congue nisi vitae suscipit. Tristique senectus et netus et malesuada fames ac. A pellentesque sit amet porttitor eget dolor morbi non arcu. Vivamus at augue eget arcu dictum. Elit ullamcorper dignissim cras tincidunt lobortis feugiat. Facilisis mauris sit amet massa vitae tortor condimentum. Maecenas volutpat blandit aliquam etiam erat velit. Dolor sit amet consectetur adipiscing elit pellentesque habitant morbi. Volutpat est velit egestas dui id ornare arcu odio. Euismod nisi porta lorem mollis aliquam ut porttitor leo a. Semper risus in hendrerit gravida rutrum quisque non tellus orci. Lobortis scelerisque fermentum dui faucibus in ornare quam.
[br][/br][br][/br]
Urna nec tincidunt praesent semper. Quis risus sed vulputate odio ut enim blandit volutpat maecenas. Ut placerat orci nulla pellentesque dignissim enim sit amet. Odio facilisis mauris sit amet massa vitae tortor condimentum lacinia. Imperdiet nulla malesuada pellentesque elit eget gravida cum. Bibendum enim facilisis gravida neque convallis a cras semper. Pretium quam vulputate dignissim suspendisse in est ante in nibh. Morbi tristique senectus et netus. Tellus rutrum tellus pellentesque eu tincidunt. Quis vel eros donec ac odio tempor orci. Nascetur ridiculus mus mauris vitae ultricies leo integer malesuada. Cursus risus at ultrices mi tempus imperdiet nulla. Id velit ut tortor pretium viverra suspendisse potenti. Tellus cras adipiscing enim eu turpis egestas. Tempus imperdiet nulla malesuada pellentesque elit eget gravida cum. Ut diam quam nulla porttitor massa id neque. Velit aliquet sagittis id consectetur purus ut. Sed risus ultricies tristique nulla aliquet enim tortor at auctor. Pretium lectus quam id leo in vitae.
[br][/br][br][/br]
Magna fermentum iaculis eu non diam phasellus. Tempor id eu nisl nunc mi ipsum faucibus vitae. Sem nulla pharetra diam sit. Vitae tortor condimentum lacinia quis vel eros donec. Erat imperdiet sed euismod nisi porta. Aliquet risus feugiat in ante metus dictum at. Diam sollicitudin tempor id eu nisl nunc mi ipsum faucibus. Amet dictum sit amet justo donec enim diam vulputate. A arcu cursus vitae congue mauris rhoncus aenean vel. Venenatis urna cursus eget nunc scelerisque viverra mauris in. Nunc scelerisque viverra mauris in. Nulla facilisi cras fermentum odio eu. Ullamcorper dignissim cras tincidunt lobortis. Accumsan tortor posuere ac ut consequat semper. Massa id neque aliquam vestibulum morbi blandit cursus risus. Mauris a diam maecenas sed enim. Lectus vestibulum mattis ullamcorper velit sed. Lorem ipsum dolor sit amet.
[br][/br][br][/br]
Diam volutpat commodo sed egestas egestas fringilla phasellus faucibus. Quis commodo odio aenean sed adipiscing diam donec. Amet volutpat consequat mauris nunc congue nisi vitae suscipit. Facilisi morbi tempus iaculis urna id volutpat lacus laoreet non. Arcu dictum varius duis at consectetur lorem. Viverra orci sagittis eu volutpat odio facilisis mauris. Lacinia at quis risus sed. Sed vulputate odio ut enim blandit volutpat. Nisl purus in mollis nunc. Est ultricies integer quis auctor elit sed vulputate mi. Leo integer malesuada nunc vel risus commodo viverra maecenas. Aliquam id diam maecenas ultricies mi eget mauris pharetra et. Mollis nunc sed id semper risus in hendrerit gravida. Vitae turpis massa sed elementum tempus.
[br][/br][br][/br]
[/div][/div]
[div class=sidebar]
[/div]
[div class=sidebartext]Scelerisque viverra mauris in aliquam sem fringilla ut morbi. Nulla facilisi nullam vehicula ipsum a arcu cursus. Volutpat lacus laoreet non curabitur gravida. Egestas quis ipsum suspendisse ultrices gravida dictum fusce ut placerat. Et odio pellentesque diam volutpat commodo sed. Non enim praesent elementum facilisis leo vel fringilla est ullamcorper.
[/div]
[/div]
[/nobr]
