Source code
Revision control
Copy as Markdown
Other Tools
<!DOCTYPE html>
<meta charset="utf-8">
<link rel=stylesheet href="resources/customizable-select-styles.css">
<style>
.before-placeholder {
height: 20px;
background: lime;
}
.after-placeholder {
height: 20px;
background: blue;
}
</style>
<button class="customizable-select-button" popovertarget="popover" id="button">
<span class="customizable-select-selectedcontent">one</span>
</button>
<div id="popover" popover="auto" class="customizable-select-popover">
<div class="before-placeholder"></div>
<div class="customizable-select-option selected">one</div>
<div class="customizable-select-option">two</div>
<div class="after-placeholder"></div>
</div>
<script>
document.getElementById("popover").showPopover({ source: button });
</script>