mehr classes statt ids
This commit is contained in:
parent
5708fd52f5
commit
fe243507ec
3 changed files with 10 additions and 9 deletions
|
@ -29,7 +29,7 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|||
<span class="item dot dot2"></span>
|
||||
<span class="item dot dot3"></span>
|
||||
<span class="item dot dot4"></span>
|
||||
<div id="renderarea" class="renderarea"></div>
|
||||
<div class="letterarea"></div>
|
||||
<!-- glossy reflection -->
|
||||
<span class="reflection"></span>
|
||||
</div>
|
||||
|
@ -54,7 +54,7 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|||
</div>
|
||||
<p id="disclaimer">Created by fritteli, inspired by <a href="http://www.qlocktwo.com/">QLOCKTWO</a>.
|
||||
<script type="text/javascript">
|
||||
var uhr = new Uhr($('#renderarea'), $('#theme'));
|
||||
var uhr = new Uhr($('#uhr'), $('#theme'));
|
||||
$(document).ready(function() {
|
||||
$('#themeswitcher').on('change', function() {
|
||||
uhr.setTheme(this.value);
|
||||
|
|
2
uhr.css
2
uhr.css
|
@ -39,7 +39,7 @@ body {
|
|||
}
|
||||
#themeswitcher {
|
||||
}
|
||||
.uhr .renderarea {
|
||||
.uhr .letterarea {
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 5em;
|
||||
|
|
13
uhr.js
13
uhr.js
|
@ -14,11 +14,12 @@ along with this program. If not, see <http://www.gnu.org/licenses/>.
|
|||
*/
|
||||
/**
|
||||
* Die Uhr.
|
||||
* @param renderarea Das jQuery-gewrappte HTML-Element, auf dem die Uhr angezeigt werden soll.
|
||||
* @param clockarea Das jQuery-gewrappte HTML-Element, auf dem die Uhr angezeigt werden soll.
|
||||
* @param themeElement Das HTML-Stylesheet-Tag, das das Theme-CSS referenziert.
|
||||
*/
|
||||
function Uhr(renderarea, themeElement) {
|
||||
this.renderarea = renderarea;
|
||||
function Uhr(clockarea, themeElement) {
|
||||
this.clockarea = clockarea;
|
||||
this.letterarea = clockarea.find('.letterarea');
|
||||
this.themeElement = themeElement;
|
||||
this.timer = null;
|
||||
this.currentTheme = null;
|
||||
|
@ -64,7 +65,7 @@ Uhr.prototype.setLayout = function(locale) {
|
|||
var newLayout = this.layouts[locale];
|
||||
if (newLayout !== undefined && newLayout != this.currentLayout) {
|
||||
this.currentLayout = newLayout;
|
||||
var renderer = new UhrRenderer(this.currentLayout, this.renderarea);
|
||||
var renderer = new UhrRenderer(this.currentLayout, this.letterarea);
|
||||
renderer.render(this);
|
||||
$.cookie('layout', locale);
|
||||
}
|
||||
|
@ -103,10 +104,10 @@ Uhr.prototype.update = function() {
|
|||
}
|
||||
}
|
||||
Uhr.prototype.clear = function() {
|
||||
this.renderarea.parent().find('.item').removeClass('active');
|
||||
this.clockarea.find('.item').removeClass('active');
|
||||
}
|
||||
Uhr.prototype.highlight = function(itemClass) {
|
||||
this.renderarea.parent().find('.item.' + itemClass).addClass('active');
|
||||
this.clockarea.find('.item.' + itemClass).addClass('active');
|
||||
}
|
||||
Uhr.prototype.getHour = function(date) {
|
||||
if (typeof this.currentLayout.getHour === 'function') {
|
||||
|
|
Loading…
Reference in a new issue