- Details
- Written by: Stanko Milosev
- Category: HTML5
- Hits: 12712
<!DOCTYPE html> <html> <body> <dialog class="modal"> <p>This is da dialog!</p> <button id="close">Close</button> </dialog> <button id="show">Open Dialog!</button> </body> </html>JS:
<script type="text/javascript">
var dialog = document.querySelector('dialog');
document.querySelector('#show').onclick = function() {
dialog.show();
};
document.querySelector('#close').onclick = function() {
dialog.close();
};
</script>
Here note line:
document.querySelector('dialog')
this is something new what I learned today.
Live example:
Example taken from this web site, via this one. On Tympanus you can find few more examples of overlay window, if you need support for older browsers.
- Details
- Written by: Stanko Milosev
- Category: HTML5
- Hits: 11351
Example of customizing HTML5 input type range.
HTML:
<!DOCTYPE html> <html> <head> <link type="text/css" rel="stylesheet" href="/myStyle.css"> </head> <body> <input type="range" id="test" min="10" max="100" step="1"> </body> </html>
CSS:
input[type='range'] {
-webkit-appearance: none !important;
background:red;
height:7px;
}
input[type='range']::-webkit-slider-thumb {
-webkit-appearance: none !important;
background:blue;
width: 34px;
height: 34px;
border: 1px solid rgba(200,200,200,1);
border-radius: 18px;
}
Look on an example here.
- Details
- Written by: Stanko Milosev
- Category: Arch linux
- Hits: 6390
If google earth crashes, as it was on my machine, then try to download libGL.so.1 from here, and copy it to /opt/google/earth/free
Taken from here.
- Details
- Written by: Stanko Milosev
- Category: Arch linux
- Hits: 5758
An unofficial extension pack providing GNOME2 like features for GNOME3.