Firefox 4 Glasklar 0

Die Firefox Entwickler haben sich ja mächtig ins Zeug gelegt was die 4te Version des Browser angeht. Was aus meiner Sicht fehlt ist schlichtweg eins: Glas. Nun als ambitionierter Windows 7 fehlte mir einfach das Areo Glas. Nun wie habe ich das Problem gelöst? Die Lösung ist simpel, im Profilordner von Mozilla Firefox befindet sich eine Datei namens userChrome.css (Bei Windows 7 findet ihr diese unter C:\Users\Username\AppData\Roaming\Mozilla\Firefox\Profiles\EuerProfil\chrome). Diese Könnt ihr nun bearbeiten, moderne CSS-Kenntnisse vorausgesetzt. Mein Firefox sieht dann so aus :

 

 

Weiterlesen »

“Webdesign mit Photoshop” von Jonas Hellwig 0

Jonas Hellwig lebt und arbeitet als Webdesigner, Illustrator und Art-Director in Düsseldorf.

Er verfasst Artikel, Fachbücher und Video-Trainings zum Thema Webdesign und ist als Dozent und Trainer tätig.

Jonas hat den Blog kulturbanause gegründet, in dem er über Artikel, Tutorials, Downloads, Tipps, Hacks, Snippets und aktuelle Szene-News rund um Webdesign und digitale Bildbearbeitung informiert.

Sein neues Buch “Webdesign mit Photoshop” befasst sich mit dem Einsatz von Photoshop für den Bereich Webdesign, zum Beispiel im Hinblick auf übersichtliche Navigationen und ansprechende Texturen.

Galileo Press selbst schreibt zu dem Buch:

“Sie wollen anspruchsvolle, moderne Webdesigns mit Adobe Photoshop gestalten? In diesem Video-Training zeigt Ihnen Webdesign-Experte Jonas Hellwig, wie Sie Photoshop CS5 als Webdesigner effizient einsetzen. Erleben Sie den Profi bei der Arbeit und lassen Sie sich inspirieren für zeitlose, spannende Webdesigns. Gestalten Sie Icons, Seitenhintergründe und übersichtliche Navigationen. Lernen Sie, worauf es bei der Gestaltung im Web ankommt, und profitieren Sie von zahlreichen Tipps zur CSS-Umsetzung. Ein kurzweiliger Lernkurs für alle, die mit Ihren Webseiten im World Wide Web auffallen wollen. Inkl. Adobe Photoshop CS5 als Testversion auf der DVD.”

Wenn ihr mehr über das Buch erfahren möchtet, dann schaut euch doch einfach den entsprechenden Artikel auf Jonas Hellwigs Blog an.

Animierte Hintergrundbilder mit jQuery 0

Heute gibt’s mal ein nützliches jQuery Tutorial in dem ich euch zeigen werde wie man bewegte Hintergrundbilder erstellt damit ihr wisst was ich meine gibt’s hier ne Demo davon. Damit lassen sich tolle Dinge realisieren z.B. Interessante Header oder Große Panoramabilder können schön hin und her bewegt werden.

Die Realisierung des ganzen ist ziemlich einfach und zwar nutzen wir die jQuery animate Funktion um die CSS-Eigenschaft background-position zu animieren.

Der Javascript-Code sieht dann so aus:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
$(document).ready(function (){
 
//hier das div element eintragen
var $sliderElement = $('#header');
//Gesschwindigkeit mit der sich das Bild bewegt
var moveSpeed = 30;
//hier die URL des hintergrund bildes eintragen
var backgroundImage = new Image();
backgroundImage.src = "pan2.jpg";
//erst wenn das bild geladen ist fängt das "sliden" an
$(backgroundImage).load(function() {
//das geladene Bild als Hintergrund bild setzten
$sliderElement.css('background-image','url(' + backgroundImage.src + ')');
//ausrechnen wie viele Pixel des bildes nicht angezeigt werden
var spaceToMove = $sliderElement.innerWidth() - backgroundImage.width;
//diese rekursive funktion kümmert sich um die animation
//movingDirection gibt an ob sich das Bild nach links(+=) oder nach rechts(-=) bewegt.
var moveBackgroundImage = function (movingDirection)	{
//Hier wird der Hintergrund mit hilfe der jQuery.animate Funnktion animiert (http://api.jquery.com/animate/)
// movingDirection + spaceToMove ergibt einen string wie '-=1305' der dann angibt wie weit sich das Bild bewegen soll
// Das Zweite Argument ( backgroundImage.width * moveSpeed ) je kleiner der move speed ist desto schneller die bewegung
$sliderElement.animate({'backgroundPosition' : movingDirection + spaceToMove} , backgroundImage.width * moveSpeed , 'linear' , function ()	{
//wenn die Animation beendet ist bewegen wir es wieder in die andere richtung
if(movingDirection == '-=')	{
//Nach links bewegen
moveBackgroundImage('+=');
} else {
//Nach rechts bewegen
moveBackgroundImage('-=');
}
});
}
//Animation Starten
moveBackgroundImage('+=');
});
});

 

Das HTML-Markup so:

1
2
3
4
5
<div id="header">
 
Panorama
 
</div>

Der CSS-Code so:

1
2
3
4
5
6
#header	{
margin:10% auto;
width:500px;
height:250px;
background-color:#666;
}

Der HTML und CSS-Code ist nur ein Beispiel wie ich ihn in der Demo verwendet habe. Dieser wird nicht wirklich benötigt.

Viel Spaß beim basteln. Frage gerne als Kommentar

Website ohne Klicken 0

Während eines langweiligen Nachmittags bin ich auf meinem Weg durchs Internet auf eine relativ spannende Seite gestoßen. Diese Seite beschäftigt sich mit der Funktionsweise von Buttons die gänzlich ohne Klicken erstellt werden. Demnach ist auch die komplette Website so aufgebaut, dass man ohne zu klicken problemlos navigieren kann. Für mich eine sehr spannende Sache, da das endlich mal wieder was neues ist .

Der Links zur Seite ist: http://www.dontclick.it/

Gefunden habe ich diese Seite übrigens mit dem Plugin StumbleUpon (http://www.stumbleupon.com/). Dieses Plugin sucht anhand vorher vom Benutzer eingegebenen Daten und Themenbereichen dazu passende Websites. Perfekt wenn man mal gerade nichts besseres zu tun hat und einfach mal im Internet herumstöbern will.

Meine Erste iPad App 0

Nach 2 Wochen harter Arbeit ist meine erste iPad App Fertig. Die App gibt’s leider nur auf der Gamescom zu sehen und nicht im Store ;-) Die App wird am Stand der Spielefachmagazine PS3M und 360-Live zu finden sein. In jener App können die Besucher des Messestandes ein Abo bestellen, Das Aktuelle Heft lesen, Die Community mit einer Kurznachricht von 160 Zeichen grüßen, sich für den Newsletter eintragen oder auch News von der Webseite lesen. Hier gibts noch ein paar Screenshots von der App ;-)

 

Einfache Mehrsprachigkeit in PHP 0

Soll eine Webanwendung erfolgreich sein muss sie Heute vor allem Global Funktionieren sprich jeder auf der Welt soll sie Verstehen. Hierfür gibt es natürlich wie immer viele Wege.

Am einfachsten ist es alle Sprachvariablen in ein Array zu schreiben auf das man dann zugreift z.B gibt man dann einfach echo $lang['download_success'] aus um den Benutzer in seiner Sprach mitzuteilen das ein Download erfolgreich war usw. Jeder der so schon mal gearbeitet hat wird schnell feststellen das dieses System ein entschiedenen Nachteil hat. Will man dem Benutzer jetzt beispielsweise begrüßen mit Meldungen wie “Hallo Name, schön das du wieder da bist” taucht ein erstes Problem auf wie bekomme ich den Namen in den String die wohl einfachste aber zugleich umständlichste Methode wäre es die Sprachvariable in zwei Teile zu zerlegen. Sprich

$lang[welcome_1] = „Hallo“;

$lang[welcome_2]= „, schön das du wieder da bist“;

Echo $lang[welcome_1] . $sUsername . $lang[welcome_2];

Das ist eine Lösung die bei größeren Projekten total versagt da sie meiner Meinung nach vieeel zu umständlich ist. Viel Sinnvoller ist es doch in die Sprachstrings Variablen reinzuschreiben und diese dann zu ersetzen. Das sähe dann z.B. so aus:

$lang[welcome] = „Hallo %name%, schön das du wieder da bist“;

Echo str_replace(‚%name‘ , $sUsername , $lang[‚welcome‘];

Vom Grundsatz her ist das schon mal ganz gut aber immer noch nicht sehr produktiv.

Ich habe das Problem letztlich so gelöst:

Die Sprachvariablen stehen in einer INI-Datei nach dem Schema

Name_der_Variable=“Hallo ich bin der Sprach String %s <- das ist eine Variable in der Sprachvariable“

Der Konstruktor der Klasse lädt die Sprachvariablen in ein assoziatives Array. Um auf eine Variable zuzugreifen habe ich die Methode lang($name , $values… ) definiert. $name ist der Name der Sprachvariable $values… sind die Werte mit denen die Variablen in den Sprachstrings ersetzt werden sollen (vgl. printf ).

Teil 2 folgt noch.

Nützliche Android-Apps 0

Wer sich fragt, welche Apps er noch für sein Android-Gerät gebrauchen könnte, kann ja mal hier in meine kleine Liste der für mich wichtigsten Apps gucken.

ASTRO – Datei Manager mit vielen Funktionen. Braucht man einfach. Ist kostenlos.

AudioManager – erlaubt es die verschiedenen Lautstärkelevels von z.B. Alarm, Medien, Rufton etc. zu ändern. Kann man dann auch als Widget auf den Homescreen einfügen. Perfekt, wenn man in der Schule sicher gehen will, dass das Handy auf jeden Fall leise ist, auch bei Spielen. In der Lite-Version kostenlos.

Handcent SMS - Ersatz für die SMS App. Bietet viel mehr Funktionen und Einstellungsmöglichkeiten als die original SMS-Anwendung. Kostenlos.

SwiFTP - Erlaubt das starten eines FTP-Servers auf dem Handy. So kann man über W-Lan, aber auch über 3G, falls erwünscht, Dateien vom PC auf das Handy senden. Kostenlos.

CoPilot Live - Offline Navigationssoftware. Gibt es nicht viel zu sagen. Gibt viel Kartenmaterial dafür und funktioniert. Mit DACH-Karten: 29,99€ ( http://www.alk.eu.com/de/ )

Mimetypes als Defines? 0

Du brauchst einige Mime-Typen als C/C++ Defines? Dann bist du hier genau richtig :D Weiterlesen »

HTTP Status Codes als Defines 0

Für ein Aktuelles Projekt hab ich mir alle HTTP-Status Codes in defines geschrieben. Mich nervt so was immer ungemein daher stelle ich sie mal hier zur Verfügung für alle denen es ähnlich geht :P

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
 
//1xx Informal
 
#define HTTP_STATUS_CONTINUE "100 Continue"
#define HTTP_STATUS_SWITCHING_PROTOCOLS "101 Switching Protocols"
 
//2xx Sucess
 
#define HTTP_STATUS_OK "200 OK"
#define HTTP_STATUS_CREATED "201 Created"
#define HTTP_STATUS_ACCEPTED "202 Accepted"
#define HTTP_STATUS_NO_CONTENT "204 No Content"
#define HTTP_STATUS_RESET_CONTENT "205 Reset Content"
#define HTTP_STATUS_PARTIAL_CONTENT "206 Partial Content"
 
//3xx Redirection
 
#define HTTP_STATUS_MULTIPLE_CHOICES "300 Multiple Choices"
#define HTTP_STATUS_MOVED_PERMANENTLY "301 Moved Permanently"
#define HTTP_STATUS_FOUND "302 Found"
#define HTTP_STATUS_SEE OTHER "303 See Other"
#define HTTP_STATUS_NOT_MODIFIED "304 Not Modified"
#define HTTP_STATUS_USE_PROXY "305 Use Proxy"
#define HTTP_STATUS_TEMPORARY_REDIRECT "307 Temporary Redirect"
 
//4xx Client Error
 
#define HTTP_STATUS_BAD_REQUEST "400 Bad Request"
#define HTTP_STATUS_UNAUTHORIZED "401 Unauthorized"
#define HTTP_STATUS_PAYMENT_REQUIRED "402 Payment Required" //no used
#define HTTP_STATUS_FORBIDDEN "403 Forbidden"
#define HTTP_STATUS_NOT_FOUND "404 Not Found"
#define HTTP_STATUS_METHOD_NOT_ALLOWED "405 Method Not Allowed"
#define HTTP_STATUS_NOT_ACCEPTABLE "406 Not Acceptable"
#define HTTP_STATUS_PROXY_AUTHENTICATION_REQUIRED "407 Proxy Authentication Required"
#define HTTP_STATUS_REQUEST_TIMEOUT "408 Request Timeout"
#define HTTP_STATUS_CONFLICT "409 Conflict"
#define HTTP_STATUS_GONE "410 Gone"
#define HTTP_STATUS_LENGTH_REQUIRED "411 Length Required"
#define HTTP_STATUS_PRECONDITION_FAILED "412 Precondition Failed"
#define HTTP_STATUS_REQUEST ENTITY_TOO_LARGE "413 Request Entity Too Large"
#define HTTP_STATUS_REQUEST-URI_TOO_LONG "414 Request-URI Too Long"
#define HTTP_STATUS_UNSUPPORTED_MEDIA_TYPE "415 Unsupported Media Type"
#define HTTP_STATUS_REQUESTED RANGE_NOT_SATISFIABLE "416 Requested Range Not Satisfiable"
#define HTTP_STATUS_EXPECTATION_FAILED "417 Expectation Failed"
#define HTTP_STATUS_TOO_MANY_CONNECTIONS_FROM_YOUR_INTERNET_ADDRESS "421 There are too many connections from your internet address"
 
//5xx Server Error
 
#define HTTP_STATUS_INTERNAL_SERVER_ERROR "500 Internal Server Error"
#define HTTP_STATUS_NOT_IMPLEMENTED "501 Not Implemented"
#define HTTP_STATUS_BAD_GATEWAY "502 Bad Gateway"
#define HTTP_STATUS_SERVICE_UNAVAILABLE "503 Service Unavailable"
#define HTTP_STATUS_GATEWAY_TIMEOUT "504 Gateway Timeout"
#define HTTP_STATUS_HTTP_VERSION_NOT_SUPPORTED "505 HTTP Version Not Supported"

 

Ich hoffe ich habe jemanden etwas Zeit und Arbeit erspart :D

Die Vresh Android App 0

Also ich muss schon sagen Android Handys und Android an sich ist ne tolle Sache. Als ich mich vor ein paar Wochen dafür entschieden hatte mir ein HTC Desire zu kaufen dachte ich mir kurzerhand ich könnte mir ja schon mal das SDK anschauen. Eigentlich wollte ich nur bisschen “rumspielen” aber letztendlich wurde die “VreshApp” daraus. Nun ja die Funktionsweise ist simpel : Man loggt sich auf seinen Android Handy ein und erhält dann Zugang zu geheimen Vresh-Funktionen *gg*. Bis jetzt ist aber auch nur der Login fertig :P

Naja hier sind einige Screenshots :