Search Form Demo Pages A collection of useful examples you can play with
Example: Responsive Mobile
The working example below shows the usage with customized design:
Custom Header
Widget Code (please note that uuid
parameter should be different for your own widget ):
<div style="-webkit-box-shadow: 2px 2px 13px 0px rgba(50, 50, 50, 0.75); max-width:620px;
-moz-box-shadow: 2px 2px 13px 0px rgba(50, 50, 50, 0.75);
box-shadow: 2px 2px 13px 0px rgba(50, 50, 50, 0.75); padding:10px;margin: 30px 0px;">
<h3 class="title-divider">
<span>Custom <span class="de-em">Header</span></span>
</h3>
<div id="ws-widget" style="max-width:620px; width: 100%"></div>
</div>
<script src="//services.wheel-size.com/code/ws-widget.js"></script>
<script>
var widget = WheelSizeWidgets.create('#ws-widget', {
uuid: 'ed83f09f5d404e1e9270b61927f87046',
width: '100%'
});
</script>
Additional CSS Code :
@media (max-width: 500px){
.widget .finder .bootstrap-select {
width: 90%;
margin-top: 5px;
}
}