<select name="hoge">
    <option value="1">角屋のあじフライ</option>
    <option value="2">角屋のいわしフライ</option>
    <option value="3">かどやんソース</option>
  </select>

select + .fukidashi{
  display: none;
}
select:focus + .fukidashi{
  display: block;
}


.fukidashi *{
  margin:0;
  padding:0;
}
.fukidashi > *{
  line-height: 1.5em;
  text-align: center;
  color: #fff;
  cursor:pointer;
  width: 100%;
}
.fukidashi > *:hover{
  color: #1a84ca;
  background: #fff;
}
.fukidashi > *:hover:before{
  content: '';
  display: inline-block;
  width: 0;
  margin-left: -0.4em;
  border-top: solid 0.4em transparent;
  border-left: solid 0.4em #1a84ca;
  border-bottom: solid 0.4em transparent;
  border-right: solid 0.4em transparent;
}
.fukidashi > *{
  border-bottom: solid 1px #fff;
}
.fukidashi > *:last-of-type{
  border:0;
}
.fukidashi{
  display: inline-block;
  background-color: #1a84ca;
  padding: 0.2em 0.4em;
  border-radius: 0.5em;
  position: relative;
  width: 7em;
  user-select: none;
  -webkit-user-select: none;
}
.fukidashi:before{
  content: '';
  width: 0;
  height: 0;
  display: inline-block;
  position: absolute;
  bottom: 100%;
  left:0;
  right:0;
  margin: auto;
  border-top: solid 1em transparent;
  border-bottom: solid 0.6em #1a84ca;
  border-left: solid 0.4em transparent;
  border-right: solid 0.4em transparent;
}

$(function(){
  var $select = $("select");
  var $parent = $("<div class='fukidashi-parent'></div>").css({position:"relative",display:"inline-block"});
  $select.wrap($parent);
  var $blocking = $("<div class='blocking'></div>").css({position:"absolute",top:0,left:0,width:"100%",height:"100%","z-index":10,"background-color":"transparent"}).appendTo($select.parent());
  
  var $parents = $select.parent('div');
  
  var n=1;
  $select.each(function(){
    var $this = $(this);
    var x = $("<div class='fukidashi'></div>").css({position:"absolute",top:"1.5em",left:0,right:0,margin:"auto",width:"110%","z-index":9999999});
//    $("option", this).clone().appendTo(x).css({display:"block",cursor:"pointer"});
    $("> option", $this).each(function(){
      $("<div>" + $(this).text() +"</div>").attr("data-value", $(this).val()).appendTo(x).css({cursor:"pointer"});
    });
    $("> div", x).on("mousedown touchstart", function(){
      $this.val( $(this).data("value") );
    });
    x.insertAfter($(this));
  });
  
  $blocking.on("click", function(){
    $(this).parent().children("select").focus();
  });
});