dev.strombild


Posts Tagged »javascript«


May 10th, 2012 by Michael

jquery Nivo Slider effects

Liste von allen Fadingeffekten für den Nivo Bilder Slider:

sliceDown
sliceDownLeft
sliceUp
sliceUpLeft
sliceUpDown
sliceUpDownLeft
fold
fade
random
slideInRight
slideInLeft
boxRandom
boxRain
boxRainReverse
boxRainGrow
boxRainGrowReverse

stackoverflow.com/questions/6511074/how-to-set-different-effects-in-nivo-slider?answertab=active#tab-top

Tags: , ,


January 10th, 2012 by Michael

Impress js

Javascript Präsentationstool mit Zoom-, Dreh- und 3D Effekten.

bartaz.github.com/impress.js

Tags: , , ,


May 3rd, 2011 by Michael

hasClass, addClass und removeClass ohne jQuery

Es muss ja nicht immer gleich jQuery sein:

function hasClass(ele,cls) {
	if (typeof ele == 'undefined' || ele == null || !RegExp) {
		return false;
	}
	var reg = new RegExp('(^|\\s)'+cls+'(\\s|$)');
	if (typeof(ele) == 'string') {
		return reg.test(ele);
	} else if (typeof(ele) == 'object' && ele.className) {
		return reg.test(ele.className);
	}
	return false;
}
 
function addClass(ele,cls) {
	if (!hasClass(ele,cls)) {
		ele.className += ' '+cls;
	}
}
 
function removeClass(ele,cls) {
	if (hasClass(ele,cls)) {
		var reg = new RegExp('(^|\\s)'+cls+'(\\s|$)');
		ele.className = ele.className.replace(reg,' ');
	}
}

Tags:


December 7th, 2010 by Michael

Modernizr

Modernizr ist ein Javascript, welches die Unterstützung von CSS3 und HTML5 -Funktionen als CSS-Klassen in den <html> Tag der Webseite einfügt. Damit lassen sich dann CSS-basierte Fallbacklösungen leicht einbauen.

Das sieht dann beispielsweise so aus:

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de" class=" js flexbox canvas canvastext no-webgl no-touch geolocation postmessage websqldatabase no-indexeddb hashchange history draganddrop websockets rgba hsla multiplebgs backgroundsize borderimage borderradius boxshadow textshadow opacity cssanimations csscolumns cssgradients cssreflections csstransforms csstransforms3d csstransitions fontface video audio localstorage sessionstorage webworkers applicationcache svg no-inlinesvg smil svgclippaths">

Eine CSS-Weiche würde dann so aussehen:

/* Wenn @font-face unterstützt wird */
.fontface #header {
	font-size: 22px;
	font-weight: normal;
}
 
/* Wenn @font-face nicht unterstützt wird */
.no-fontface #header {
	font-size: 18px;
	font-weight: bold;
}

Mit Javascript kann man die Unterstützung ebenfalls abfragen:

if(Modernizr.csscolumns) {
	alert('Spaltenfluss wird unterstützt');
}

www.modernizr.com

Tags: , , ,


November 23rd, 2010 by Michael

Google Analytics: IP-Adresse anonymisieren

Der Zusatz

_anonymizeIp()

im Google Analytics Tracker Code bewirkt, dass die IP-Adresse des Besuchers nur teilweise übertragen wird. Damit ist ein einzelner User nicht mehr eindeutig identifizierbar und nur noch eine grobe Lokalisierung möglich.

Quelle: code.google.com/intl/de-DE/apis/analytics/docs/gaJS/gaJSApi_gat.html#_gat._anonymizeIp

Tags: , ,


September 27th, 2010 by Michael

Google Suchwörter Highlight

Javascript. Highlighted die Suchergebnisse auf der eigenen Seite wenn man von der Googleergebnisseite aus kommt.

www.kryogenix.org/code/browser/searchhi

Tags: , ,


September 8th, 2010 by Michael

Performance von Javascript testen und vergleichen

Auf der Seite http://jsperf.com kann man verschiedene Javascripts auf Geschwindigkeit hin überprüfen und untereinander vergleichen. Außerdem kann man vorhandene Tests anderer Nutzer einsehen:

z.B. http://jsperf.com/jquery-vs-sizzle-vs-midori-vs-mootools-selectors-test

Tags: , ,


April 23rd, 2010 by Michael

window.moveTo auf Firefox / Mac

window.moveTo(0,0);

funktioniert nicht auf Firefox / Mac. Stattdessen muss man 

window.moveTo(0,1);

benutzen.

Tags:


March 15th, 2010 by Michael

Ajax Push Engine

Open Source Comet Server und Javascript Framework für Echtzeitdatentransfer mit Ajax.

www.ape-project.org

Tags: , ,


March 3rd, 2010 by Michael

Suchfeld bei Safari

Javascript:

// Suchfeld Safari
function safari_suchfeld(id) {
if (document.getElementById && navigator.appVersion.indexOf('Safari')>-1) {
	document.getElementById(id).type='search';
	document.getElementById(id).setAttribute('results','8',1);
	document.getElementById(id).setAttribute('autosave','such_id',1);
	document.getElementById(id).setAttribute('placeholder','stichwort',1);
}
}
safari_suchfeld('s');
 

Html: 

 
<input type="text" name="search" value="" id="s" />

Ergebnis:

Tags: , ,


« Older Entries