HTML | Undolog.com

Sehr kurze Trick: Vielseitigkeit von CSS-Klassen

Montag, 10. November, 2008

Die meisten Experten bereits kenne ihn, aber ich bin oft gefragt, was ist der Unterschied zwischen class und id CSS Style Sheets. Ein Überblick über einige Unterschiede und Warnungen finden Sie es in den Klassen und ID in CSS, jedoch eine nützliche Funktion, unterscheidet class id ist die Fähigkeit, mehrere Klassen. Sie können beispielsweise definieren:

PLAIN TEXT

CSS:

border :2px solid #000 } . BordoNero (border: solid 2px # 000)
color :#f00 } . ColoreRosso (color: # f00)
border :2px solid #f00 } . BordoRosso (border: solid 2px # f00)

und schreiben in HTML:

PLAIN TEXT

HTML:

> Bordo nero con caratteri rossi </div> <div class = "bordoNero coloreRosso"> Border schwarz mit roter Schrift </ div>
> Bordo rosso con caratteri rossi </div> <div class = "bordoRosso coloreRosso"> Border rot mit roter Schrift </ div>

class im Gegensatz zu id kann es innerhalb von mehreren Definitionen in beliebiger Reihenfolge!

jquery: Runde Kanten an Bilder, um zu Überschneidungen

Donnerstag, 30. Oktober, 2008

Aufgrund der unterschiedlichen Rendering zwischen verschiedenen Browser, der sicherlich finden Sie im Microsoft Internet Explorer zu berücksichtigen, müssen wir immer Mittel zu beantragen artifizi Effekte, die jetzt sollte ein Standard. Die Multi-diskutiert abgerundeten Kanten sind ein klassisches Beispiel für die "Katastrophe", hergestellt durch die vollständige Unfähigkeit zur Erreichung einer Standard ernsthaft auf Seite Rendering HTML / CSS. Es gibt zahlreiche Networking-Lösungen, die Ihnen die Möglichkeit zu "Auswirkungen" (Auswirkungen Freistellung dall'HTML als abgerundeten Kanten, Schatten Effekte, Reflexionen, etc ...) mit Patches auf den Blättern der Stile, spezielle Tricks mit div veredelten , JavaScript-Bibliotheken, die Nutzung von canvas etc ...
Aus rein pädagogischen ich würde erklären, weitere technische (Cross-Browser), die für die abgerundeten Kanten der Bilder:

Demos und Quellen

Lesen Sie weiter ... "

Wordpress: ändern AdminBigWidth für Entwickler

Freitag, 17. Oktober, 2008

AdminBigWidth ist ein Plugin für Wordpress können, um den Arbeitsbereich der gesamten Bildschirm. Es ist ein wirklich einfaches Plug-and-trivial, weil der Code tut, ist die .wrap

PLAIN TEXT

PHP:

AdminBigWidth Funktion () (
; echo '<style type="text/css">. wrap (max-width: keine) </ style>';
)
, 'AdminBigWidth' ) ; add_action ( 'admin_head', 'AdminBigWidth');

Für diejenigen, die wie ich mit dem Wordpress-Editor im HTML-Modus kann nützlich sein, um eine feste Zeichen, wie z. B. Courier, statt der vorgeschlagenen Standard-Schriftart. In diesem Weg, zumindest für Entwickler, ist es einfacher, um Source-Code. Gehen Sie hierzu einfach den Stil der AdminBigWidth, einen neuen Ansatz, die sich CSS sull'editoria, wenn im HTML-Modus. Man könnte ein Plugin schreiben (zwei Zeilen), dies zu tun, aber es ist besser zu nutzen ihren Code AdminBigWidth, um zu vermeiden, eine weitere Belastung aufgrund all'ennesimo Plugin:

PLAIN TEXT

PHP:

AdminBigWidth Funktion () (
; echo '<style type="text/css">. wrap (max-width: none) # # editorcontainer Inhalt (font-family: "Courier New, Courier, Monospace) </ style>';
)
, 'AdminBigWidth' ) ; add_action ( 'admin_head', 'AdminBigWidth');

jquery: Animierte HintergrundFarbe

Mittwoch, 15. Oktober, 2008

Ich habe es nicht verstehen, wenn es sich um einen Fehler oder etwas gewünscht, aber es bleibt die Tatsache, dass die Methode animate() jquery funktioniert nicht mit einigen CSS-Eigenschaften, einschließlich der background-color (die als camelize ist backgroundColor Zum Beispiel der folgende Code erzeugt keine Wirkung:

PLAIN TEXT

HTML:

> <style type = "text/css">
# div-Box (background-color: # EEE; width: 100px; height: 100px)
</ Style>
<! - .... ->
> </div> <div id = "box"> </ div>

PLAIN TEXT

JavaScript:

) . animate ( { backgroundColor: "#f90" } ) ; $ ( "# Feld Abt."). Animieren ((Hintergrundfarbe: "# F90"));

Um dieses Problem zu beheben ist die Installation eine Erweiterung: jquery Color Animationen. Dies ermöglicht es Ihnen, "Animation" sull'attributo backgroundColor und darüber hinaus:

backgroundColor
borderBottomColor
borderLeftColor
borderRightColor
borderTopColor
color
outlineColor

Wordpress: wie man eine Antwort auf den Kommentar mit jquery

Freitag 3. Oktober, 2008

Vor kurzem Cristiano Fino eine Gewinn-Plugin für Wordpress können zwei Links zu jeder Kommentar von einem Post (vielleicht haben Sie installiert eine ähnliche, angesichts der Tatsache, dass das Verzeichnis Wordpress.org Ich habe ein paar Irre, sondern als ein italienischer Software wäre die Veranstaltung zu Ehren der ausgezeichneten Arbeit von Cristiano). Diese Link (Antwort & shares), treffen und / oder ein Zitat der Autor von einem Kommentar, indem Sie die langweilige Betrieb, um das Zeichen an (@), um anzuzeigen, an wen sie gerichtet ist. In diesem Tutorial möchte ich erklären - in den mittel-erfahrene Benutzer - wie Sie diese beiden Features "auf der Hand", ohne all'istallazione Plugin. Auch nutzen die Möglichkeiten der jquery an die Partei, in Javascript. Die Technik stellt die gleichen I verwendet, um diese Funktion in diesem Blog.

Hinweis: Die Verwendung eines Plug ist die beste Lösung für diejenigen, die häufig zur Änderung ihrer Vorlage Wordpress oder zumindest, hat in der Erwartung zu tun. Dieses Tutorial soll nur zeigen, wie Sie gezielt in den Code Wordpress und ist für die meisten neugierig.

Ändern Sie die Datei comments.php

Die erste Änderung zu machen ist, geben Sie den Link "Antwort" und "Einheiten" innerhalb jeder Kommentar. Um dies zu tun, bearbeiten Sie die Datei comments.php befindet sich im Ordner unserer Thema. Diese Datei enthält alle Anweisungen, die Ihnen erlauben, um die Kommentare am Ende eines Posts. Der Abschnitt, der uns interessiert (die können geringfügig vom Thema zu Thema) ist die Schleife Schaffung der verschiedenen Stellungnahmen, erkennbar durch:

Lesen Sie weiter ... "

Menü Combo Kategorien in WordPress 2.5.1

Donnerstag, 10. Juli, 2008

So erstellen Sie ein Menü / Combo (Tag select ohne eine Schaltfläche auf, und in der Lage, positionieren Sie den aktuell angezeigten Kategorie, können Sie den folgenden Code ein:

PLAIN TEXT

HTML:

onchange = 'document.location.href=this.options[this.selectedIndex].value;' > <select name = "event-dropdown" onchange ='document.location.href=this.options[this.selectedIndex].value;'>
> Seleziona una categoria </option> <option "" Wert => Wählen Sie eine Kategorie </ option>
<? Php
? ( single_cat_title ( '' , false ) ) : "" ) ; $ Foo = ((is_category ())? (Single_cat_title ('', false)): "");
) ; $option = '' ; $ = Get_categories Kategorien ( "SortiertNach = name & hierarchische = 0 '); $ option ='';
foreach ($ Kategorien als $ cat) (
$cat- > cat_name == $foo)?"selected":"" ).' $ Option .= '<option'. (($cat-> cat_name == $ foo)? "Ausgewählt": ""). " value = "/ category /". $ cat-> category_nicename .'">';
$ Option .= $ cat-> cat_name;
$ Option .= '('. $ Cat-> category_count .')';
$ Option .= "</ option> ';
)
echo $ Option;
>
</ Select>

Die Veranstaltung onchange in Tag select beseitigen können eine beliebige Taste auf "Submit". Die Funktion WordPress is_category() entscheiden, ob wir sehen ein "Archiv" Kategorien aus, um den Titel / Name der Kategorie angezeigt.

Shadowbox 2.0: Release Candidate 1

Dienstag, 8. Juli, 2008

Es wurde freigegeben Release Candidate 1 (RC1) Version 2.0 Javascript-Bibliothek Shadowbox, Michael Jackson JI, hilfreich zu öffnen Fenster für die Ansichten der verschiedenen Arten von Medien, von Flash auf QuickTime zu HTML-Seiten. In dieser neuen Version sind:

Die Webseite ist voll von Informationen und jetzt auch ein Assistent (im Stil von mootools), um on-the-fly ein Paket von benutzerdefinierten Bibliothek auf unsere Bedürfnisse
Fähigkeit zur Nutzung einer Form Standalone-Basis, ohne notwendigerweise auch - Adapter für - wie prototype.js externe Bibliotheken, jquery, etc. ...
Verbesserungen an der Verwaltung und Durchführung der Haut
Standort

Die Bibliothek ist auch auf SVN unter:

  http://michaeljackson.googlecode.com/svn/trunk/shadowbox

Text Ersetzung Techniken in Flash

Mittwoch, 25. Juni, 2008

Die Technik der Text Ersetzung Ich bin heute ist in mancher Hinsicht, wirklich interessant. Im Gegensatz zu den klassischen Bild, um es zu ersetzen durch CSS, diese Technik nutzt eine Flash, um die Titel von unserer Seite. Obwohl es ein bisschen mehr, denn es erfordert die Schaffung eines Flash-Filmes und die Verwendung von Javascript, erlaubt eine Reihe von Vorteilen nicht gleichgültig:

Hält 's Zugänglichkeit der Website mit einer True-unaufdringlich-Javascript so, dass die Crawler und Spinnen weiter, um zu sehen, die Seite so einfach und richtig HTML
Nicht erfordern das Erstellen von Bildern n für n Titel. Nur ein Film zu ersetzen alle Titel von unserer Seite, mit erheblichen Einsparungen in Bezug auf Download
Ermöglicht Ihnen das Erstellen von einfachen Titel, aber mit Font normalerweise nicht auf dem Web
Der Text kann gemacht werden in HTML, dank der Eigenschaften von Flash
Der Text ist wählbar
Da es sich um ein Flash können Sie Interaktivität und Animationen aller Art

Sie werden bemerken auch, dass dieses Verfahren CSS sind praktisch nicht berücksichtigt!

Lesen Sie weiter ... "

Text Ersetzung Techniken in HTML / CSS

Montag, 23. Juni, 2008

Der richtige Weg, um Titel in Grafiken auf einer Web-Seite ist zu ersetzen mit Style Sheets (siehe Progressive Enhancement in Accessibility und Usability: unaufdringlich Javascript). Diese Technik können Sie die Inhalte der Website ohne Grafiken angezeigt, die von Bogen von Stilen. Darüber hinaus, Crawler und Spinnen haben eine korrekte Lesung HTML-Methoden ignorieren die Ersetzung Angebots zu Ende Grafiken. Legen Sie ein Bild direkt (TAG img macht es den Titel unzugänglich zu normalen ASCII-Leser (Crawler, Spinnen, blog-Plugin, Screen-Reader, etc. ...).
Lesen Sie weiter ... "

Snipplr Code 2.0: Fragmente (Snippe) Code nützlich

Samstag, 26. April, 2008

Es war eine lange Zeit wollte ich erwähnen, diese wertvolle Dienstleistung für die Programmierung. Snipplr (Code 2.0) ist ein echter Aggregator oder Repository von nützlichen Bits des Codes. Sie können kostenlos registrieren und ihre Teile des Codes und vor allem genießen Sie die vielen Snippe bereits vor Ort. Ich habe behandelt vielen Sprachen (Actionscript, ASP, C #, Matlab, PHP, Rails, SVN, etc. ...), alle gut sortiert und katalogisiert. Sie können auch eine praktische Plugin für Wordpress können Sie auf unserem Blog Snippe-Code durch seine eindeutige ID.

Undolog.com

Sehr kurze Trick: Vielseitigkeit von CSS-Klassen

Verwandte Post