TriangleSelectors

h1. Triangle Selectors

An attempt to create a new method to collect gender identity and sexaulity information that doesn't hold to the exclusivity of the gender binary or sexuality binaries.

h2. To Use

Include the following in your header of the page you want to use the selectors:

<pre> <code> <script src="raphael-min.js"></script> <script src="triangle-selectors.js"></script> </code> </pre>

This code will display the gender triangle selector field and will set the genderVal gender value given in (male, female, none). The genderXPos and genderYPos will be the absolute coordinates of the circle selector in the field. When the page is loaded if the genderXPos and genderYPos have values in them the javascript will place the selector starting at that position.

<pre> <code> <div id="genderTriField"></div> <input type="hidden" id="genderVal" value=""></input> <input type="hidden" id="genderXPos" value=""></input> <input type="hidden" id="genderYPos" value=""></input> </code> </pre>

This code will display the sexuality triangle selector field and will set the sexualityVal gender value given in (men, women, indifferent). The sexualityXPos and sexualityYPos will be the absolute coordinates of the circle selector in the field. When the page is loaded if the sexualityXPos and sexualityYPos have values in them the javascript will place the selector starting at that position.

<pre> <code> <div id="sexualityTriField"></div> <input type="hidden" id="sexualityVal" value=""></input> <input type="hidden" id="sexualityXPos" value=""></input> <input type="hidden" id="sexualityYPos" value=""></input> </code> </pre>

h3. Related Information:

• "Designing a Better Drop-Down Menu for Gender":http://www.sarahdopp.com/blog/2010/designing-a-better-drop-down-menu-for-gender/
• "Kinsey scale":http://en.wikipedia.org/wiki/Kinsey_scale