A Pen by Daria

Thumbnail
This awesome code was written by DM_Daria, you can see more from this user in the personal repository.
You can find the original code on Codepen.io
Copyright DM_Daria ©

Technologies

  • HTML
  • CSS
  • JavaScript
<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  <title>A Pen by  Daria</title>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
  
  <link rel='stylesheet prefetch' href='https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css'>

      <link rel="stylesheet" href="css/style.css">

  
</head>

<body>

  <form  method="get" action="" role="search" id="form-role">

<label>Role:</label>
<div class="styled-select">
  
  
<select id="role">

  <option value="NetDeveloper">.NET Developer</option>
  <option value="NetSoftwareArchitect">.NET Software Architect</option>
  <option value="Sales">Sales Executive</option>
  <option value="SeniorNetDeveloper">Senior .NET Developer</option>
  <option value="ScrumMaster">Scrum Master</option>
  <option value="QaEngineer">QA Engineer</option>
  <option value="HtmlCssJsDeveloper">CSS, HTML, JavaScript Developer</option>
  <option value="PCS">Pre-Sales Consultant</option>
  <option value="SeniorQaEngineer">Senior QA Engineer</option>
  <option value="JavaScalaDeveloper">Java/Scala Developer</option>
  <option value="BDM">Business Development Manager</option>
  <option value="SystemAnalyst">System Analyst</option>

</select>
  </div>
<button type="button" id="btnRole">SEARCH</button>
  
</form>
  <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js'></script>

  

    <script  src="js/index.js"></script>




</body>

</html>

/*Downloaded from https://www.codeseek.co/DM_Daria/a-pen-by-daria-EENOYw */
select {
   background: transparent;
   width: 268px;
   padding: 5px;
   font-size: 16px;
   line-height: 1;
   border:0;
   border-radius: 0;
   height: 34px;
   -webkit-appearance: none;
   }
.styled-select {
  position: relative;
   width: 240px;
   height: 34px;
   overflow: hidden;
   border-bottom: 1px solid #333;
   }
.styled-select:after {
  content:"\f107";
  position: absolute;
  right:0;
  top:0;
}

/*Downloaded from https://www.codeseek.co/DM_Daria/a-pen-by-daria-EENOYw */
// onChange: function(option){
//     window.location = 'http://amdaris.com/Careers/' + option.value;
// }
$("#btnRole").click(function() {
  var role_value = $("#role").val();
    window.open('https://amdaris.com/Careers/' + role_value, '_blank');

    });

Comments