Ankündigung

Einklappen
Keine Ankündigung bisher.

Feauture Request: Text-Popup bei Icons (Symbol, Switch, Dual)

Einklappen
X
 
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

    Feauture Request: Text-Popup bei Icons (Symbol, Switch, Dual)

    Hallo,

    wäre es möglich, den Icons einen Text mitzugeben, der als Popup angezeigt wird, wenn die Maus für eine bestimmte Zeit über dem Icon ruht?

    So könnte man z.B. in der Haus- oder Raumübersicht ein Warnsymbol anzeigen und würde die Warnmeldung gezeigt bekommen, wenn man mit der Maus auf das Warnsymbol fährt. Das würde die Seiten übersichtlich halten und man bräuchte auch keine zusätzliche Seite, um den Text anzuzeigen.

    Gruß
    Peter

    #2
    Für den switch könnte das z.B. so aussehen:

    in basic.html:
    HTML-Code:
    {% macro switch(id, gad, pic_on, pic_off, val_on, val_off, txt_on, txt_off) %}
    
    	<span id="{{ uid(page, id) }}" data-widget="basic.switch" data-item="{{ gad }}"
    		data-val-on="{{ val_on|default('1') }}" data-val-off="{{ val_off|default('0') }}"
    		data-txt-on="{{ txt_on|default('on') }}" data-txt-off="{{ txt_off|default('off') }}"
    		
    		data-pic-on="{{ pic_on|default(icon1~'control_on_off.png') }}" data-pic-off="{{ pic_off|default(icon0~'control_on_off.png') }}"
    		class="switch"><a><img class="icon" src="{{ pic_off|default(icon0~'control_on_off.png') }}" title="{{ txt_off|default('off') }} /></a>
        </span>
    
    {% endmacro %}
    in widget.js:
    Code:
    // ----- basic.switch ----------------------------------------------------------
    $(document).delegate('span[data-widget="basic.switch"]', {
    	'update': function (event, response) {
    		$('#' + this.id + ' img').attr('src', (response == $(this).attr('data-val-on') ? $(this).attr('data-pic-on') : $(this).attr('data-pic-off')));
    		$('#' + this.id + ' img').attr('title', (response == $(this).attr('data-val-on') ? $(this).attr('data-txt-on') : $(this).attr('data-txt-off')));
    	},
    
    	'click': function (event) {
    		if ($('#' + this.id + ' img').attr('src') == $(this).attr('data-pic-off')) {
    			io.write($(this).attr('data-item'), $(this).attr('data-val-on'));
    		}
    		else {
    			io.write($(this).attr('data-item'), $(this).attr('data-val-off'));
    		}
    	}
    });
    Gruß
    Peter

    Kommentar

    Lädt...
    X