From 4e02942edcdc4b5c416ba304a7e13c8b9d7154ae Mon Sep 17 00:00:00 2001
From: Jinhyuk Jun <jinhyuk.jun@samsung.com>
Date: Wed, 9 Jan 2013 16:04:47 +0900
Subject: [PATCH] toggleswitch : demo page modify

input detail guide for toggle switch

Change-Id: I9d651e6cd62edf4ab0d6a84d6c35f896e6afe9b6
---
 .../tizen-winsets/widgets/switch/toggleswitch.html | 26 ++++++++++++++++++----
 1 file changed, 22 insertions(+), 4 deletions(-)

diff --git a/demos/tizen-winsets/widgets/switch/toggleswitch.html b/demos/tizen-winsets/widgets/switch/toggleswitch.html
index fcd7c67..6be30f0 100755
--- a/demos/tizen-winsets/widgets/switch/toggleswitch.html
+++ b/demos/tizen-winsets/widgets/switch/toggleswitch.html
@@ -2,21 +2,38 @@
 	<div data-role="header">
 		<h1>ToggleSwitch</h1>
 	</div>
+
 	<div class="content" data-role="content">
+		<br>
 		<label for="flip-1">1. Tizen normal switch:</label>
+		<br><br>
 		<select name="flip-11" id="flip-11" data-role="slider">
 			<option value="off"></option>
 			<option value="on"></option>
 		</select>
-		<br><br>
+		<br>
+		<p>Tizen UX toggle switch has image button for on/off.<br>
+			To display image toggle switch, use jqueryMobile data-role="slider" <br>
+			then remove text for option tag</p>
+		<p style="width:100%; padding:1em; background-color:whitesmoke; color:black; border-width:3px; border-style:inset">
+			 add element's width to css file <br>
+			&lt;select data-role="slider"&gt;<br>
+			&nbsp;&lt;option value="off"&gt;&lt;/option&gt;<br>
+			&nbsp;&lt;option value="on"&gt;&lt;/option&gt;<br>
+			&lt;/select&gt;<br>
+		</p><br><br>
+
 		<div data-role="fieldcontain">
-		<label for="flip-3">2. Text toggle switch:<br>
-			(support when webDev. write text to option tag)</label>
+			<label for="flip-3">2. Text toggle switch:</label>
+			<br><br>
 			<select name="flip-3" id="flip-3" data-role="slider">
 				<option value="nope">Nope</option>
 				<option value="yep">Yep</option>
 			</select>
-		<div>
+			<br>
+			<p>To display jqm style swtich,<br>
+				set text for option tag</p>
+		</div>
 		<br><br>
 
 		<div class ="containing-element">
@@ -33,6 +50,7 @@
 			&nbsp;}<br>
 		</p>
 	</div> <!-- /content -->
+
 	<div data-role="footer">
 	</div>
 </div> <!-- page -->
-- 
2.7.4