jQuery-RoundSelect

Created: 2012-03-25 01:15
Updated: 2013-12-07 10:37

README.md

jQuery - RoundSelect

What is it good for:

jQuery Round Select help you to integrade a selection of round shapes of an Image inside of your Webapplication.

Screenshot

Demolink

How to use:

Integrade the libarys to your code:

<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="js/raphael-min.js"></script>
<script type="text/javascript" src="js/jquery.RoundSelect.0.1.js"></script>

Create a DIV container, with the image as background:

#holder{
    width:500px;
    height:390px;
    background-color: #eee;
    overflow: auto;
    background-image: url( "test.jpg" );
}
<div id="holder"></div>

Create the forms field, which should hold to data of you selected elipse:

<input id="roundselect_cx" name="roundselect_cx" type="text"/>
<input id="roundselect_cy" name="roundselect_cy" type="text"/>
<input id="roundselect_rx" name="roundselect_rx" type="text"/>
<input id="roundselect_ry" name="roundselect_ry" type="text"/>

Initialize the Plugin:

<script type="text/javascript">
$(document).ready(function(){
   $('#holder').RoundSelect();
});
</script>

Have Fun!

Questions or suggestions?

If you have any questions or suggestions, please feel free to contact me frederick.behrends@gmail.com.

A special thanks goes to:

softm - for letting me proceed and finish this plugin with his example code.

Cookies help us deliver our services. By using our services, you agree to our use of cookies Learn more