Web 2.0 Mit Der Yahoo User Interface Library

Web 2.0 mit der YAHOO! User Interface Library Stephan Schmidt, 1&1 Internet AG

Agenda ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Wer bin ich? ,[object Object],[object Object],[object Object],[object Object],[object Object]

Komponenten der YUI ,[object Object],[object Object],[object Object],[object Object],[object Object]

YUI Design Patterns ,[object Object],[object Object],[object Object]

YUI Design Patterns Beispiele ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

YUI CSS Ressourcen ,[object Object],[object Object],[object Object],[object Object]

YUI Utilities ,[object Object],[object Object],[object Object],[object Object],[object Object]

YUI Widgets ,[object Object],[object Object],[object Object],[object Object]

YUI Widgets (2) ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Installation ,[object Object],[object Object],[object Object]

Inhalt der Distribution ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Einbinden der Klassen ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Alternative Installation ,[object Object],[object Object],[object Object],[object Object]

Vorteile ,[object Object],[object Object],[object Object]

Nachteile ,[object Object],[object Object],[object Object]

Browser-Unterstützung ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

A-Grade Browser ,[object Object],[object Object],[object Object]

C-Grade-Browser ,[object Object],[object Object],[object Object],[object Object]

X-Grade-Browser ,[object Object],[object Object],[object Object]

CSS Ressourcen ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

reset.css (587 Bytes) ,[object Object],[object Object],[object Object]

fonts.css (416 Bytes) ,[object Object],[object Object],[object Object],[object Object]

grids.css (2.526 Bytes) ,[object Object],[object Object],[object Object]

Das YAHOO Objekt ,[object Object],[object Object],[object Object],var calClass = YAHOO.widget.Calendar; var myCal = new calClass(…);

Eigene Namespaces ,[object Object],[object Object],[object Object]

Vererbung ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Weitere Features ,[object Object],[object Object],[object Object]

DOM-Features ,[object Object],[object Object],[object Object],YAHOO.util.Dom.setStyle('abs', 'opacity', 0.5); YAHOO.util.Dom.getStyle('abs', 'opacity'); ,[object Object]

Arbeit mit CSS-Klassen ,[object Object],[object Object],[object Object],[object Object],[object Object]

Weitere DOM-Features ,[object Object],[object Object],[object Object],[object Object]

Batch-Processing ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Event-Handling ,[object Object],var oElement = document.getElementById("elementid"); function fnCallback(e) { alert("click"); } // Listener anhängen YAHOO.util.Event.addListener(oElement, "click", fnCallback);

Event-Handling ,[object Object],[object Object],[object Object],[object Object],[object Object]

Event-Handling ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Custom Events ,[object Object],[object Object],[object Object],[object Object],[object Object]

Animationen ,[object Object],[object Object],[object Object],[object Object]

Animationen ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

AJAX-Features ,[object Object],[object Object],[object Object],[object Object],[object Object]

AJAX-Beispiel ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

AJAX-Anwendungen ,[object Object],[object Object],[object Object],[object Object]

Weitere Utilities ,[object Object],[object Object],[object Object],[object Object]

Widgets und Controls ,[object Object],[object Object],[object Object],[object Object],[object Object]

Autocomplete ,[object Object],[object Object],[object Object],[object Object]

Autocomplete HTML ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

AutoComplete Datasource ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

AutoComplete Widget ,[object Object],[object Object],[object Object],[object Object]

Weitere Features ,[object Object],[object Object],[object Object],[object Object],[object Object]

Datenquellen ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Menu ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Menu aus Markup ,[object Object],[object Object],var menu = new YAHOO.widget.Menu("menudiv"); menu.render(); menu.show();

Menu-Beispiele ,[object Object]

Datumsauswahl mit Calendar ,[object Object],[object Object],var cal = new YAHOO.widget.Calendar("cal", "container"); cal.render();

Konfigurationsoptionen ,[object Object],[object Object],[object Object],[object Object],[object Object]

Auf Auswahl reagieren ,[object Object],[object Object],[object Object],[object Object],[object Object],cal.selectEvent.subscribe(function(o) {…});

Container Elemente ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Basis-Markup ,[object Object],[object Object],[object Object],[object Object],[object Object],var myPanel = new YAHOO.widget.Panel("myPanel"); myPanel.setHeader("Titelzeile");

Weitere Widgets ,[object Object],[object Object],[object Object],[object Object],[object Object]

Vorteile der YUI ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Erweiterungen ,[object Object],[object Object],[object Object]

YAHOO.ext ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]

Weitere Informationen ,[object Object],[object Object],[object Object]

Ende ,[object Object],[object Object],[object Object]

Web 2.0 Mit Der Yahoo User Interface Library

Recommandé

Recommandé

Contenu connexe

Tendances

Tendances (20)

Similaire à Web 2.0 Mit Der Yahoo User Interface Library

Similaire à Web 2.0 Mit Der Yahoo User Interface Library (20)

Plus de Stephan Schmidt

Plus de Stephan Schmidt (20)

Web 2.0 Mit Der Yahoo User Interface Library