Skip to content

Instantly share code, notes, and snippets.

@maxpelic

maxpelic/dabblet.css

Last active December 21, 2015 15:49
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save maxpelic/6329766 to your computer and use it in GitHub Desktop.
Save maxpelic/6329766 to your computer and use it in GitHub Desktop.
Download ZIP
popmenu
Raw
dabblet.css
/**
* popmenu
*/
img{
transition:;
}
#body{
float:right;
margin-left:200px;
margin-top:100px;
}
body{
background-color:white;
height:500px;
width:500px;
}
#popnav{
transform: rotate(0);
transition:width 1s, color 1s, background-color .5s, box-shadow 1s, transform 20s;
transform: rotate(-45deg);
box-shadow:2px 2px 10px #997;
width:auto;
background-color:orange;
border-radius:10px;
padding:20px;
margin-left:-350px;
margin-top:0px;
padding-left:300px;
padding-right:500px;
position:fixed;
border-bottom:5px solid #FFCC0A;
border-top:1px solid#FFCC0A;
float:left;
}
#popnav a{
transition:border-radius 2s;
color:black;
text-decoration:none;
font-family:Verdana bold;
width:auto;
padding:10px;
border-radius:10px;
background-color:#FFC00A;
box-shadow:0px 0px 10px grey;
margin-left:5px;
margin-right:5px;
border-bottom:2px solid #FFCC0A;
border-top:1px solid#FFCC0A;
}
#popnav a:hover{
box-shadow:0px 0px 20px grey;
border-radius:75%;
}
#popnav a:active{
box-shadow:0px 0px 4px #FFF;
}
Raw
dabblet.html
<!-- content to be placed inside <body>…</body> -->
<div id="popnav">
<a href="http://pelictech.blogspot.com">Blog</a>
<a href="http://facebook.com/pelictech">Facebook</a>
<a href="#">Home</a>
</div>
<div id="body">
<img src="http://www.w3schools.com/images/w3schoolslogoNEW310113.gif"/>
<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSc22YPIP7y1rjCP347Y5hbcVN3wZTAiVlI2e-GpDa7_-FaPiCx"/>
</div>
Raw
dabblet.js
// alert('Hello world!');
Raw
settings.json
{"view":"separate","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment