Letzte Artikel
Kategorien
Kategorie Archiv: coding
//implement missing function
document.getElementsByClassName = function(cl) {
var retnode = [];
var myclass = new RegExp('\\b'+cl+'\\b');
var elem = this.getElementsByTagName('*');
for (var i = 0; i < elem.length; i++) {
var classes = elem[i].className;
if (myclass.test(classes)) retnode.push(elem[i]);
}
return retnode;
};
//framework functions
function $(id){ return document.getElementById(id); }
function html(id, html){ $(id).innerHTML = html; }
function css(id, style){ $(id).style.cssText += ';'+style;}
function $$(class){ return document.getElementsByClassName(class); }
You can find a testrun here: http://jsfiddle.net/ZjsYB/
Based on a Thomas Fuchs article found here.
[Source: Online PhD Programs for Mashable
.com]
Geht ganz einfach: JavaScript ausschalten und dann Bild über das Kontextmenü (Rechtsklick) speichern. Achtung: Nicht erst die Grafik alleine anzeigen und dann speichern, dann greift der Server ein und man hat nur ein Bild, auf dem StudiVZ “böse, böse” sagt…
Nicht sonderlich kreativ gesichert von den Leuten, aber genug Hindernis für viele Nutzer wie mir scheint…
Kleiner Test:
Für den Internet Explorer 6 kursieren einige PNG-Fixes. Angefangen bei Filtern in der CSS-Datei bis hin zu ausgeklügelteren Methoden. Besonders überzeugt hat mich der dd_belated PNG-Fix, der auch sich wiederholende Hintergründe erlaubt, was bei den anderen nicht möglich ist.
Außerdem lässt er sich einfach auch in eigenen Scripten zusätzlich verwenden, wenn Inhalte versteckt und dann angezeigt werden sollen. Der Vorteil bei dd_belated liegt an der Benutzung von VML anstatt des üblichen Alphafilters, was bessere Resultate ermöglicht. Was bleibt, ist natürlich eine kurze Verzögerung bis zum Ausführen des Scriptes und der damit kurz sichtbaren falsch angezeigten PNGs.
Recht häufig trat bei der Verwendung des Fixes ein Problem mit der Positionierung des Elementes selber im Elternelement auf. Ein einfaches “position:relative” für das umgebende Elternelement reichte dann aber meist aus.
Mach es gut, mein Alter Freund
Nachdem sich google nun bei youtube und facebook selbst langsam vom Internet Explorer 6 verschabschieden und allgemein schon zur Beerdigung des Internet Explorer 6 aufgerufen wird, wollte ich mal kurz ein paar sinnvolle Links hier verbreiten, die sich im Laufe der Zeit bei mir angesammelt haben (Lebt er noch?):
- HTML5 tags auch mit dem IE6
- Fake CSS3 mit dem IE6
- Image replacement mit text-indent auch bei <input> Buttons
- Cheat sheet und Übersicht der unterstützten CSS-Elemente aller IEs
- 25 Tipps für das IE6 Bugfixing
- Warum ist der IE6 doof? Anti-IE6-Seiten
- Machen wir doch nen besseren Browser daraus: google chrome frame
- fixed width in Internet Explorer 6
- Du kommst hier nicht rein
- Wie soll ichs richtig angehen? Ein kleiner Denkanstoß für IE6 Verweigerer
- CSS – Was der IE6 nicht kann und man ihm nur mit Tricks beibringt
- Universelle CSS nur für den IE6
- Tipps zum JavaScript-Debugging im IE6
- Update Hinweis für die eigene Seite, ebenso hier
- das Alles (und noch viel mehr) können wir machen, wenn der IE6 tot ist
- ie6fixer – Hilfe bei der Erstellung von Stylesheets
- Grundsätzliche CSS-Probleme des IE6 beheben, ebenso hier
- Laufzeitbeschränkte Virtual PC Images mit den diversen Internetexplorern
- der beste PNG-Fix für Transparenzen in pngs (meiner Meinung nach)
- Wie verhindere ich zusätzliche requests im IE6 bei mehrfach verwendeten Bildern?
- den IE6 zum IE7 oder IE8 machen (na ja, in etwa …)
Ja, mein alter Freund, was werden wir ohne Dich machen, wenn wir Dich nicht mehr zum ultimativen Feind ernennen können? Das wird ganz schön langweilig werden…
Keine Herausforderung mehr, alles wird totaler Standard, keine Bugs mehr zu beheben, die uns den Verstand kosten. Frontend- und Backendleuten wird dann der Konsens fehlen, kein Hass auf Dich mehr, der sie zusammenschweißt…
Ich glaube, ich werde mich dann wieder mehr mit dem Wetter auseinandersetzen müssen. Ganz schön kalt draußen, oder?
shttp://www.onderhond.com/blog/work/ie6-core-bug-fixing
Einen schnellen und flexiblen Online-Editor für kleinere HTML und JavaScript Experimente findet man unter http://jsfiddle.net/. Es ist erstaunlich, was mit diesem kleinen Editor jetzt schon möglich ist. So kann man unter anderem Mootools, jQuery oder Prototype als gewünschtes Framework bestimmen, den Doctype auswählen oder sogar externe CSS-Dateien einbinden.
JSfiddle zeigt dabei immer nur das notwendigste, beispielsweise bei der HTML-Datei nur den Inhalt des body-tags ohne den Rest des Dokumentes. Damit ist es ein leichtes, mal eben einen kleinen Testlauf eines JavaScript Schnippsels zu starten oder den Einfluss auf die Elemente zu testen. Hier mal ein simples Beispiel mit Prototype und Scriptaculous.
Wenn man inline Styles überschreiben, macht man das mit !important, will man aber nur inline gestylte Tags in CSS im Webdesign überschreiben, gibt es keine andere Möglichkeit, als diese styles direkt anzupassen? Falsch!
Eine weitere Möglichkeit ist mit Hilfe des [style] Keywords innerhalb eines Scriptblockes oder einer externen CSS nur diese Tags mit inline Styles anzusprechen.
Ein Beispiel :
<div class="showMe"> <span style="font-weight: bold; color: #ff0000;">Hello World - wird gestyled</span> </div> <div class="showMe"> <span>Hello World - wird nicht gestyled</span> </div>
.showMe span[style]{font-weight: normal !important;color: #0000ff !important;}
Wie das immer so ist und wie man sich wahrscheinlich aufgrund des [style] im Selektor denken konnte, funktioniert dies nicht im IE6, aber im IE7 & IE8 sowie allen modernen Browsern.
Natürlich bleibt die Frage, wann man so etwas sinnvoll anwenden kann, da man inline styles generell vermeiden
sollte, aber es kann mit Sicherheit nicht schaden, so etwas zu wissen.
Seeing is believing, daher gibt es hier ein kleines Showcase.
[gefunden bei SOTAHNAKA]
Heute habe ich mich mal kurz ärgern müssen, da ich nach einer Möglichkeit gesucht habe, diese netten upload Formularfelder mit CSS zu stylen. Ich wusste schon vorher, dass das nicht ohne Probleme geht, aber ich hatte es zuvor nicht benötigt.
Für diejenigen, die nicht wissen, was ich meine:
Nachdem ich selber über einer Möglichkeit gegrübelt habe, das mit ein wenig Prototype gewürzt hinzubekommen, habe ich bei anderen Webdesignern/Frontend-Entwicklern dies hier gefunden. An und für sich nicht besonders überragend, aber durchaus zweckmäßig.
Kurze Zeit später fand ich dann eine fast identische Lösung mit Prototype, musste also nicht selber noch einmal ran. Wer sich die Lösungen anschaut, wird feststellen, dass im Grunde nur ein Button über das Feld gelegt, das Feld an sich per Opacity versteckt und dann die Position der Maus auf dem Button mit dem darunter liegenden Feld gematcht wird.
Klingt kompliziert? Ist es aber nicht.
What is search engine optimization?
Wikipedia describes it as
the process of improving the volume or quality of traffic to a web site from search engines via “natural” (“organic” or “algorithmic”) search results.
I’d like to demistify the “seo” term a bit, so I came up with a list of links to help you understand what search engine optimization really is and what you or your webdesigner can do about it.
Rumour has it, that you’ll have to register your site with the search engines, which is not true. At least if we are not talking about submitting your sitemap.xml.
So, here’s the list:
