Artikel Tagged 'Safari'


Sehr kurze Trick: log JavaScript-Objekte

Wenn Sie in einer Umgebung, wo es unmöglich ist, die Debugging-Tools wie Nutzung entwickeln FireBug , wie dem Apple iPhone Simulator in Xcode, kann es frustrierend sein, um Probleme, darunter ein falscher Zugriff auf alle Eigenschaften eines Objekts zu finden. Hier ist, dass die Nutzung von Werken alert() von grundlegender Bedeutung ist!

Fortsetzung ...

Firefox 3.5.7: Wie kann der Mangel der abgerundeten Kanten eines Bildes fixieren

Manchmal muss man einfach einen Artikel zu verschieben, verändern die Sicht auf ein Problem zu lösen scheint unüberwindbar. Wenn man mit der Kompatibilität zwischen Browsern und CSS zu tun, zu erfinden Lösungen "spektakulär" hat (Stunts sagen würde) ist auf der Tagesordnung. , per Safari e Google Chrome. Was ich Ihnen eine einfache Möglichkeit, abgerundete Ecken, um Bilder mit gelten -moz-border-radius , die für Mozilla FireFox und -webkit-border-radius , Safari und Google Chrome.

Fortsetzung ...

Sehr kurze Trick: deaktivieren Sie die Größe eines textarea auf Safari

In jedem Browser entwickelt ausgehend von der Rendering-Engine WebKit (nach Vereinbarung als Safari oder Google Chrome ), die Felder textarea zeigen, unten rechts, das charakteristische Merkmal der Größenänderung. Wenn diese Besonderheit kann als sehr nützlich erweisen in einigen Fällen, in anderen wird es ein Ärgernis Element.

Fortsetzung ...

jQuery: runde Kanten auf die Bilder überlappen

Aufgrund der unterschiedlichen Rendering auf Browser, Microsoft Internet Explorer auf jeden Fall sehen, dass im Hinterkopf, wir müssen immer an Tricks Zuflucht zu Spezialeffekten, die mittlerweile zum Standard werden sollte gelten. Die vielfach diskutierte abgerundeten Kanten sind ein klassisches Beispiel für "Katastrophe" durch die völlige Unfähigkeit zu einer ernsthaften Standards auf Seite Rendern von HTML / CSS machen produziert. , etc… Es gibt viele Lösungen, die das Netzwerk an die "Effekte" (Auswirkungen der Befreiung bestehenden HTML als abgerundete Kanten, Schatten, Spiegelungen, etc ...) mit Flecken auf den Blättern von Stilen, spezielle Tricks bei der Verwendung von zu erhalten erlauben div gepfropft, Bibliotheken JavaScript, Verwendung von canvas , etc ...
Auf einer rein technischen Lehre möchte ich erklären, weitere (Cross-Browser), um die abgerundeten Kanten der Bilder anzuwenden:

Demo und Quelle

Fortsetzung ...

CSS3: hat jemand gesehen, der Internet Explorer?

Ich weiß nur nicht ...

1
2
3
4
5
6
7
8
9
{P
/ * Abgerundete Ecken * /
; /* CSS 3 */ border-radius: 9px; / CSS * 3 * /
; /* Opera */ -O-border-radius: 9px; / * Opera * /
; /* iCab */ -ICab-border-radius: 9px; / * iCab * /
; /* Konqueror */ -Khtml-border-radius: 9px; / * Konqueror * /
; /* Firefox */ -Moz-border-radius: 9px; / * Firefox * /
; /* Safari */ -Webkit-border-radius: 9px; / * Safari * /
}

Fortsetzung ...

jQuery gegen alle: ein Benchmark mit 5 Browser

Bild Ein guter Entwickler hat kein Problem damit, von einer Programmiersprache zur anderen wechseln. Die Entscheidung, auf eine bestimmte Sprache, Rahmen-oder Entwicklungsumgebung zu konzentrieren, ist durch die Verfügbarkeit von Zeit und der Art der Arbeit, die stattfindet diktiert. Doch ein wichtiger Faktor, dass die Wahl der "Rahmen" beeinflussen können, wie sich die Sympathie und Zuneigung, die im Laufe der Zeit reifen können.
Genauer gesagt, wollte ich etwas zu analysieren - sicherlich nicht alle - JavaScript-Frameworks heute verfügbar ist, weil auch "beraten", um einen Blick vor allem auf zu nehmen jQuery .
Die Macher von mootools (einer der bekanntesten JavaScript-Frameworks) zugänglich gemacht wurde ein Werkzeug, um einen Geschwindigkeitstest und ihrer Gültigkeit davon fünf bekannten JavaScript-Frameworks laufen: Slickspeed . Dieser Test, der Ausgang überhaupt nicht abgezinst, ist es wichtig, als Client-Side Javascript-Frameworks, die von Ihrem Browser ausgeführt werden, zu betreiben. Es ist genau aus diesem Grund, dass einige finden, Safari schneller als Internet Explorer oder Google Chrome schneller als Firefox . Doch dies hängt oft von der Art der angezeigten Seite. In der Tat kann es durchaus passieren, dass eine bestimmte Website ist wirklich mehr "schnell", wenn in Safari angezeigt, aber das bedeutet nicht, dass "alle Seiten" wird schneller mit Safari! Offensichtlich ist dies für alle anderen Browser gilt.

Die Benchmark-

Im Test habe ich mit gemacht Slickspeed Ich verglich die verfügbaren Browser auf meinem Rechner (Windows Vista 64bit Utilmate - Intel Core 2 Quad 2,4 GHz mit 8 GB RAM).
Leider sind die Tests nicht in der Lage, mit Internet Explorer 7 ausgeführt wird, als das Auto stürzte, ging sogar außerhalb der Skala mit den Ergebnissen! Noch einmal herzlichen Glückwunsch Microsoft.
Ich crercato auf den gleichen Stand der PC während des Testlaufs erhalten, öffnen Sie den Browser und nicht einzeln, indem Sie keine anderen Prozesse laufen.

Hinweis: Wenn Sie wie Sie auch eine oder mehrere dieser Tests fühlen, können Sie diesen Beitrag im Falle von "neugierig" und mehrere Ergebnisse zu kommentieren.

Bild

Google Chrome ist wirklich schnell Ergebnisse, mit einem Wert von 68 (Durchschnitt) in den Test mit jQuery . Je langsamer, jedoch war Flock , obwohl aus dem gleichen "Mutter" Mozilla. Das schlechte Abschneiden der Flock ist wirklich neugierig, wie seine schneiden soziale Netzwerke, weil es gerade die Social Network Web 2.0 zu nutzen, viele JavaScript-Frameworks zur Verfügung zu nehmen, um so eine Erfahrung von wirklich innovativen Navigation und Interaktion bieten.
Überraschenderweise schlägt FireFox und Opera hat auch eine nette kleine ", erreichen sogar eine 74 in die Leistung des Dojo ! Firefox und Safari unter dem Strich sind ähnlich, mit Safari schneller in Tests mit Mootools und jQuery.

Welche Rahmenbedingungen zu wählen?

Wenn Sie nichts dagegen haben Sie mit dem Testen der Geschwindigkeit der Ausführung und nicht über die normale Größe in KByte gleichen Rahmen sorgen, könnte die Antwort sein ", was Ihnen gefällt" oder, wenn Sie so wollen, "was Sie besser kennen zu lernen oder sich in Harmonie mit Ihrer Art der Programmierung. "
Letzten Endes werden diese Rahmenbedingungen sehen ein bisschen 'all (siehe zum Beispiel die Verwendung von $), obwohl einige wichtige und wesentliche Unterschiede, die in den Augen eines Experten springen kann oder wirklich schob die Verwendung einer bestimmten Bibliothek. Im Prinzip in der Tat alles, was mit jQuery getan werden kann, zum Beispiel, kann man sehr gut mit mootools oder Prototyp! Wenn jQuery hat eine sehr kompakte Syntax, wie alle Methoden immer wieder das jQuery-Objekt Grundlage, wodurch endlose Reihen von oggetto.metodo().metodo().metodo()... wird gesagt, dass dies alles Kosten einer Stärke, vor allem für diejenigen, die zu debuggen wird!
Bibliotheken wie prototype.js sin, vielleicht in der Abwesenheit von Effekten, auch einfach, die Entwickler zu zwingen als Spin-off umzusetzen scriptaculous.js , schwere und weit von der Bibliothek die erste Wahl.

Ein Beispiel

Dieser letzte Grund, zum Beispiel, führte mich zu dem gekoppelten Prototype / Scriptaculous mit jQuery zu ersetzen, um interaktive Tafeln / Animated undolog.com hier erstellen in der Seitenleiste. In der Tat, auch mit Google API, um Bibliotheken zu importieren, ist es eine Verschwendung, all die Bibliothek laden und scriptaculous für eine slidedown slideup. Für weitere Informationen und ein Beispiel, hier ist die Javascript-Code, wie es mit der Prototype / Scriptaculous gekoppelt war:

1
2
3
4
5
6
7
8
9
10
11
12
13
/ / Prototype / Scriptaculous
) . each ( $ $ ('H2.dropdown'). Stück (
element ) { Funktion (element) {
= "pointer" ; .. Element style cursor = "Zeiger";
'click' , Element. beobachten ('click',
event ) { Funktion (event) {
this . next ( ) . style . display == "" ) new Effect. BlindUp ( this . next ( ) , { duration : .5 } ) ; if (.. this. next () Stil Anzeige == "") neue Effect BlindUp (this. next (), {duration: .5});.
Effect. BlindDown ( this . next ( ) , { duration : .3 } ) ; . Effect sonst neue BlindDown (this. next (), {duration: .3});
event ) ; Event-Stop (event).;
}
)
}
);

und es ist jetzt mit jQuery:

1
2
3
4
5
6
7
8
9
10
/ / JQuery
) . each ( $ ('H2.dropdown'). Stück (
i ) { Funktion (en) {
) . css ( 'cursor' , 'pointer' ) . click ( $ (This). Css ('Cursor', 'Zeiger'). Klicken Sie auf (
function () {
$ ( this ) . next ( ) . is ( ':hidden' ) ) $ ( this ) . next ( ) . slideDown ( ) ; else $ ( this ) . next ( ) . slideUp ( ) ; if (.. $ (this) next () is (': hidden')) $ (this) next () slidedown (); else $ (this) next () slideup ();....
}
);
}
);

Alles in allem, einen genaueren Blick, glaube ich nicht, es gibt einen großen Unterschied! Aber wie ich schon sagte ... die Frage ist "auch" der persönliche Geschmack.

Fortsetzung ...

Firebug Lite: Firebug für IE, Opera und Safari

Mit Firebug Lite . Sie können eine vereinfachte Version der Notiz über die Erweiterung für Firefox-Browser Microsoft Internet Exploer, Opera und Apple Safari verwenden Firebug Lite kann auf zwei Arten eingesetzt werden: als einen Ruf als eine Bibliothek offline oder Bookmark

Bookmark Mode

Addiert man diese "besondere Adresse" Firebug Lite unseren Lesezeichen (ziehen Sie den Link in meine Favoriten) - der Code ist:

1

Sie können die Firebug Lite auf einer beliebigen Webseite aus jedem Browser. Dies ist vielleicht die attraktivste Option, obwohl die Funktionen sind sehr begrenzt.

Offline

Alternativ, wenn wir die Entwicklung einer Website, können Sie eine JavaScript und installieren Sie es auf unserer Seite! Auf diese Weise können wir Firebug Lite auch ohne Internet-Verbindung und lokal.

Firebug Lite ist ein Weg, um das Fehlen dieser Erweiterung zu anderen Browsern zu kompensieren, aber ich war langsam und sehr begrenzt, vor allem in CSS! Wie sie sagen, besser als nichts ...

Fortsetzung ...

Safari, entfernen Sie den blauen Rand am Eingabefelder

Safari, der Apple-Browser für Windows, erzeugt einen blauen Rand (blau umrandet), wenn Sie innerhalb eines Feldes klicken Sie input . Wenn es in manchen Fällen kann angenehm, wird anderen wirklich ärgerlich! So löschen Sie einfach einstecken in unserem Stylesheet:

1
2
/ * ____________________________ Entfernen blauen Rand * /
: 0 none } Eingang {outline: 0 none}

Oder alternativ direkt als Attribut in das Tag input :

1
"outline: 0 none" ... / > < Eingang style = "outline: 0 none" ... />

Fortsetzung ...

Made in the image Größenänderung von Browser

Im Prinzip sollten, wenn Sie ein Bild einfügen in ein HTML-Dokument in seiner ursprünglichen Größe verwendet werden. Doch die TAG IMG können Sie die Breite (width) und Höhe (Höhe) von jedem Bild, unabhängig von der ursprünglichen Größe zu erzwingen. Diese Skalierung ist fertig - natürlich - aus dem Browser.
Verwenden Sie die ursprüngliche Größe des Bildes ist gut, obwohl in einigen Fällen beinhaltet eine doppelte Arbeit für die Web-Designer und / oder dynamische Motoren (wie CMS oder Bibliotheken von Grafik-Manipulation) auf dem Web Server. Eine klassische Diashow, zum Beispiel, in der Regel zeigt Vorschauen oder Thumbnails (kleine Bilder) zeigen, dass, wenn Sie das Originalbild größer zu wählen.

Fortsetzung ...

Xopus: WYSIWYG-XML-Editor

Xopus ist ein XML-Editor (HTML) im WYSIWYG-Modus, die innerhalb des Browsers. Ich hatte schon vor einiger Zeit aufgefallen, dank eines Artikels auf freigesetzt Ajaxian . Ich erwähne das jetzt, weil es einen interessanten Vorschlag in die Landschaft web2.0/editor bleibt. Es ist eine interessante Erfahrung! Xopus hat wirklich gut (mit italienischer Unterstützung) entwickelt, mit einer exzellenten Umsetzung des Kontextmenüs, obwohl noch nicht vollständig Cross-Browser, der aktuellen Version 3.1 nur Microsoft Internet Explorer (Version 6 und 7 unterstützt wird ), jedoch haben die Entwickler so schnell wie mindestens eine kompatible Version mit Firefox (1. Februar hat in freigegeben worden versprochen Alpha-Version 3.1.1 ist kompatibel mit Firefox 2.0 +).

Wie bereits an anderer Stelle, verlangsamt sich die Frage der Vereinbarkeit (Cross-Browser) über den Browser, und bestraft die Entwicklung von Werkzeugen, auch nicht mit speziellen Technologien wie Java-Applets oder Adobe Flash, könnte einen wichtigen Beitrag für die Gemeinschaft! Conttibuto behindert - schließlich - vor unnötigen internen Kämpfe der derzeitigen Hersteller von Browsern: IE, Firefox, Opera, Mozilla, Safari, ...!

Anzeigen der Demo werden auch sehen, etwas mehr als einfache HTML-Editor, um es klar zu sagen. Xopus vorschlägt, ist die klassische Struktur des Editors, den Stil und die erweiterten Funktionen von Microsoft Word. Sie können in der Tat, geben die echten Smart-Objekte, die bestimmte Eigenschaften erfüllen, so dass Xopus ein besonderer Fall.

Wie auf der Website angegeben:

Xopus ist eine gute Lösung für alle Unternehmen, die eine Back-End Content Management System und in-Front-End-Publishing-Systeme und zwei Systeme, die deshalb mit der Untersuchung Informationen hat. Diese Struktur zu Informationen, um beide Runden zu kommen, deshalb ist ein Muss.

Sie können ein Video- Demonstration, dass die erweiterten Bearbeitungsfunktionen eingeführt. Sie können auch eine Demo direkt ausprobieren.

Fortsetzung ...