Permalink
Browse files

Slider tooltip: Converting back to extension.

  • Loading branch information...
gabrielschulhof committed Feb 21, 2013
1 parent 7faa9ef commit 2ca372d6393f10fd7be87e8f24b085ed5dad1c72
@@ -0,0 +1,5 @@
.ui-slider-popup {
position: absolute !important;
text-align: center;
z-index: 100;
}
@@ -25,6 +25,7 @@
@import url( "jquery.mobile.forms.rangeslider.css" );
@import url( "jquery.mobile.listview.css" );
@import url( "jquery.mobile.forms.slider.css" );
@import url( "jquery.mobile.forms.slider.tooltip.css" );
@import url( "jquery.mobile.table.css" );
@import url( "jquery.mobile.table.columntoggle.css" );
@import url( "jquery.mobile.table.reflow.css" );
@@ -1155,6 +1155,22 @@ a.ui-link-inherit {
outline-style: auto;
}
/* slider tooltip
-----------------------------------------------------------------------------------------------------------*/
.ui-slider .ui-btn-inner {
padding: 5px 0 0 0 !important;
font-size:.8em;
}
.ui-slider-popup {
width: 64px;
height: 64px;
font-size: 36px;
padding-top: 14px;
opacity: 0.8;
}

This comment has been minimized.

Show comment
Hide comment
@jaspermdegroot

jaspermdegroot Feb 22, 2013

Member

@gabrielschulhof

I think this should be in the slider tooltip structure CSS (css/structure/jquery.mobile.forms.slider.tooltip.css) instead of the theme CSS.

@jaspermdegroot

jaspermdegroot Feb 22, 2013

Member

@gabrielschulhof

I think this should be in the slider tooltip structure CSS (css/structure/jquery.mobile.forms.slider.tooltip.css) instead of the theme CSS.

/* Dimensions related to the popup arrow
-----------------------------------------------------------------------------------------------------------*/
/* desired triangle height: 10px */
@@ -1,15 +0,0 @@
.ui-slider .ui-btn-inner {
padding: 5px 0 0 0 !important;
font-size:.8em;
}
.ui-slider-popup {
position: absolute !important;
width: 64px;
height: 64px;
text-align: center;
font-size: 36px;
padding-top: 14px;
z-index: 100;
opacity: 0.8;
}
@@ -8,11 +8,9 @@
<link rel="stylesheet" href="../../_assets/css/jqm-demos.css">
<link rel="shortcut icon" href="../../favicon.ico">
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Open+Sans:300,400,700">
<link rel="stylesheet" href="slider.tooltip.css" id="tooltipStyle">
<script src="../../../js/jquery.js"></script>
<script src="../../_assets/js/"></script>
<script src="../../../js/"></script>
<script src="slider.tooltip.js" id="tooltipCode"></script>
</head>
<body>
<div data-role="page" class="jqm-demos">
@@ -27,7 +25,7 @@
<h1>Slider tooltip extension</h1>
<div data-demo-html="true" data-demo-js="#tooltipCode" data-demo-css="#tooltipStyle">
<div data-demo-html="true">
<form>
<label for="slider-1">Slider with tooltip:</label>
<input type="range" name="slider-1" id="slider-1" min="0" max="100" value="50" data-popup-enabled="true">
View
@@ -52,6 +52,7 @@
'widgets/forms/checkboxradio.js',
'widgets/forms/button.js',
'widgets/forms/slider.js',
'widgets/forms/slider.tooltip.js',
'widgets/forms/rangeslider.js',
'widgets/forms/textinput.js',
'widgets/forms/select.custom.js',
@@ -1,3 +1,12 @@
//>>excludeStart("jqmBuildExclude", pragmas.jqmBuildExclude);
//>>description: Slider tooltip extension
//>>label: Slidertooltip
//>>group: Forms
//>>css.theme: ../css/themes/default/jquery.mobile.theme.css
//>>css.structure: ../css/structure/jquery.mobile.slider.tooltip.css
define( [ "jquery", "./slider" ], function( $ ) {
//>>excludeEnd("jqmBuildExclude");
(function( $, undefined ) {
$.widget( "mobile.slider", $.mobile.slider, {
@@ -109,3 +118,6 @@ $.widget( "mobile.slider", $.mobile.slider, {
});
})( jQuery );
//>>excludeStart("jqmBuildExclude", pragmas.jqmBuildExclude);
});
//>>excludeEnd("jqmBuildExclude");

0 comments on commit 2ca372d

Please sign in to comment.