Popup Effect About Us Info Widget For Blogger By Askwithloud.com
How do I make an popup effect about us info widget for blogger by askwithloud.com?
Www.askwithloud.com So today I'm going to share with you a new and stylish about us info widget for your blog. This widget is responsive and it comes with popup effect and the best part of this widget is that, "It's not just a about us page, it's a dynamic about us widget". . What is a popup effect about us info widget for blogger by askwithloud.com? How do you make a popup effect about us info widget for blogger by askwithloud.com? This script and codes were developed by Prince on 15 December 2022, Thursday.
Popup Effect About Us Info Widget For Blogger By Askwithloud.com Previews
Popup Effect About Us Info Widget For Blogger By Askwithloud.com - Script Codes HTML Codes
<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Popup Effect About Us Info Widget For Blogger By Askwithloud.com</title> <link rel='stylesheet prefetch' href='https://fonts.googleapis.com/css?family=Open+Sans:400italic,400,700'> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div id='wrapper'> <a href='http://www.idblanter.com' title='Dunia Blanter' target='_blank'><h1><u>ASKWITHLOUD</u></h1></a>
<li class='infoindzign'><a class='popup-link' href='#popup'>Info</a></li>
</div>
<div class='popup-wrapper' id='popup'>
<div class='popup-container'>
<div class='boxinner'>
<div class='circle'></div>
<div class='circle'></div>
<div class='circle'></div>
<div class='contentbox'>
<kepala><span id='textlogo'>ASKWITHLOUD</span>
<a class='popup-close' href='#closed' title='Close'>×</a>
</kepala>
<br/>
<div class='scrollbarbox'>
<div class='innerone'>
<div id='aboutus'>
<img alt='Indzign' src='//3.bp.blogspot.com/-jrxkYbBQAYs/VidR2h2eDeI/AAAAAAAALJ8/Vg7CzLW0oYo/s1600/indzign.jpg' title='Indzign'/><br/>
<div class="totalposts"><span class="totalnumber">101</span><span class="totallabel">PUBLISH ARTICLE</span></div><br/><br/>
A biggest leading website for blogger support.<br/><br/>
Askwithloud is one of the best place to learn about web designing, so stay tuned with us and get latest css, javascript and html widgets for your blog.
</div></div></div>
<div id='left'>
<div class='taber1'><a href='http://www.idblanter.com' rel='nofollow' target='_blank' title='www.idblanter.com'>ASKWITHLOUD.COM</a></div>
<div class='taber2'><a href='https://plus.google.com/+Princechaudhri' rel='nofollow' target='_blank' title='Follow Us On Google Plus'><i class="fa fa-google-plus"></i> Google Plus</a></div>
<div class='taber3'><a href='https://www.facebook.com/askwithloud' rel='nofollow' target='_blank' title='Follow Us On Facebook'>Facebook</a></div>
<div class='taber4'><a href='https://twitter.com/askwithloud' rel='nofollow' target='_blank' title='Follow Us On Twitter'>Twitter</a>
</div>
<div class='taber6'><a href='https://codepen.io/Askwithloud/' rel='nofollow' target='_blank' title='Follow Us On Codepen'>Codepen</a></div>
<div class='taber7'><a href='http://www.blogger.com/follow-blog.g?blogID=7758488026892429494' rel='nofollow' target='_blank' title='Join this blog'>Join this blog</a></div>
</div></div></div></div></div><br/>
<span style='font-size:13px'><center>Designed by <b>ASKWITHLOUD.COM</b></center></span>
</body>
</html>
Popup Effect About Us Info Widget For Blogger By Askwithloud.com - Script Codes CSS Codes
#wrapper{background:#fff;border:1px solid #ddd;padding:10px;margin:5px;overflow:hidden;}h1{float:left;font-family:'Roboto Condensed';text-transform:uppercase;color:#444!important;}body{font-family:'Open Sans', Arial;background:#eee}a:link{text-decoration:none}.boxinner{z-index:99;width:100%;height:600px;position:absolute;left:50%;margin-left:-250px;background-color:#222;top:20px}
.contentbox{position:absolute;background-color:#fff;top:30px;right:0;left:0;bottom:0;box-shadow:0 1px 5px rgba(0,0,0,.1)}
.circle{float:left;height:7px;width:7px;margin:10px 0 0 10px;border-radius:50%}
.circle:first-child,.circle:nth-child(2),.circle:nth-child(3){background:#e74c3c}
kepala{background:#de9b31;height:50px;width:100%;position:inherit}
#textlogo{background:#f0a734;color:#fff;padding-top:15px;text-align:center;font-weight:700;font-size:15px;position:inherit;height:70%;width:61%;box-sizing:initial;}
#left{background:#222;color:#fff;top:50px;bottom:0;right:0;width:250px;position:inherit}
#left a{color:#bdc3c7;}#left a:hover{color:#fff;}
.taber1,.taber2,.taber3,.taber4,.taber5,.taber6,.taber7{cursor:pointer;font-size:14px;padding:15px 25px;color:#bdc3c7;}
.taber1:hover{background:#f88c00;color:#fff}.taber2:hover{background:#e74c3c;color:#fff}.taber3:hover{background:#2980b9;color:#fff}.taber4:hover{background:#27C9E9;color:#fff}.taber5:hover{background:#3ca9d0;color:#fff}
.taber6:hover{background:#1abc9c;color:#fff}.taber7:hover{background:#f39c12;color:#fff}
#left .taber1:hover a,#left .taber2:hover a,#left .taber3:hover a,#left .taber4:hover a,#left .taber5:hover a,#left .taber6:hover a,#left .taber7:hover a{color:#fff}
#aboutus{top:50px;width:59%;padding:10px;color:#444;text-align:left;position:inherit;float:left;line-height:normal;font-size:13px}
#aboutus img{margin:10px auto 0 auto;display:table;border-radius:100%;max-width:140px;box-shadow:0 0 0 5px rgba(0,0,0,.03)}
.scrollbarbox{overflow:hidden;text-align:justify;margin-top:45px}
.scrollbarbox .innerone{height:480px;overflow:auto}}
a.popup-link{border-bottom:3px solid #e2e2e2;border-radius:3px;padding:8px 40px!important;background:#fff;color:#555!important;text-align:center;letter-spacing:1px;margin-right:10px}
#popup{display:none;}
#popup:target{background:rgba(255, 255, 255, 0.65);display:block;position:fixed;top:0;left:0;right:0;bottom:0;margin:0;z-index:999;transition:all .3s}
.popup-container{position:relative;margin:0 auto;padding:20px}
a.popup-close{position:relative;top:5px;border-radius:50px;float:right;right:5px;margin:0 auto;padding:4px 7px;font-weight:bold;font-size:30px;text-decoration:none;line-height:1;color:#fff}
a.popup-close:hover{color:#fff}
.totalposts{margin:auto;display:table;text-align:center}
.totalposts .totalnumber{display:inline;font-weight:700;font-size:400%;color:#999}
.totalposts .totallabel{display:block;text-transform:uppercase;color:#2980b9}
li.infoindzign{border:0;float:right;list-style:none}
li.infoindzign a{background:#f39c12;color:#fff;display:block;margin:20px 20px 13px 0;padding:10px 20px;line-height:100%;border-radius:3px;font-size:90%;font-weight:bold;text-transform:uppercase;font-family:'Roboto Condensed';transition:background-color .3s}
i.infoindzign a:hover{background:#e67e22;color:#fff;}
@media (min-width:768px){.popup-container{width:600px}}
@media (max-width:767px){.popup-container{width:100%}}
| Developer | Prince |
| Username | Askwithloud |
| Uploaded | December 15, 2022 |
| Rating | 3 |
| Size | 3,549 Kb |
| Views | 10,120 |
Do you need developer help for Popup Effect About Us Info Widget For Blogger By Askwithloud.com?
Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!
Prince (Askwithloud) Script Codes
Create amazing web content with AI!
Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!
Similar Scripts & Codes
| Name | Username | Size |
| Glitchy Text Effect | Kescoe | 2,208 Kb |
| CSS Patterns | Alyda | 3,953 Kb |
| Simple Buttons | Haydenmills | 1,750 Kb |
| Improve | Gavra | 1,652 Kb |
| Drill-down Map | Good886 | 8,484 Kb |
| Caputre Cam with JS | KimmoCommit | 2,795 Kb |
| Simple personal profile | Miroot | 2,856 Kb |
| Slider | Mohammed-fawzy | 2,634 Kb |
| Random Gradients - JS | Aldlevine | 2,026 Kb |
| Hexagons | Ashmind | 4,360 Kb |
Do you want hide your ip address?
Surf anonymously, prevent hackers from acquiring your IP address, send anonymous email, and encrypt your Internet connection. High speed, ultra secure, and easy to use. Instant setup. Hide Your IP Now!