Multimedia-Anwendungen

Heute möchte ich Euch einen schönen Hover-Effekt vorstellen, der bei Mausüber einen Text zur Beschreibung eines Fotos darstellt und z.B. auch einen Link.

Diese Effekte sind ausschließlich mit CSS-Klassen erstellt und funktionieren in allen modernen Browsern.

www.nof-tutorials.com/Hover-CSS-Transitions/

Elefant

Klick mich

Der Amazing Slider ist eine sehr leicht zu verwendende Software. Das Programm erstellt einen Slider mit Fotos oder auch Videos vollkommen selbstständig.

Man kann den Amazing Slider zunächst als freie Version downloaden und testen.

Ihr müsst lediglich Eure Fotos oder Videos, auch z.B. Links zu YouTube oder anderen Seiten, eintragen. Man kann unter jeder Menge Design und unterschiedlichen Animationen wählen und hat auch die zusätzliche Option eine Lightbox zu verwenden.

Dies ist eine sehr schöne Alternative zum allseits beliebten WOW-Slider und lässt sich ebenso leicht direkt in NOF integrieren.

Hier ein Beispiel und mein Tutorial zum Einbau in NetObjects Fusion:

www.nof-tutorials.com/Amazing-Slider/

 
Amazing-Slider

 

Ihr findet auf meiner Beispielseite auch einen Link zum „Amazing Carousel“. Dieses Karussell wird ebenso eingebaut, bietet nur andere Optionen. Auch hier kann man Bilder oder Videos verwenden.

www.nof-tutorials.com/Amazing-Carousel/

 

 

Ein wirklich gutes und sehr einfach zu bedienendes Programm zur Erstellung eines HTML5 MP3 Players.

Dieser Player bietet eine Vielzahl von verschiedenen Designs, mit oder ohne Bilder. Man kann eine Gruppe von Songs oder auch einzelne Songs eintragen. Die CSS der Player ist bei Bedarf auch individuell abzuändern. Es können mehrere unterschiedliche Player auf der gleichen Seite, mittels Angabe der ID, eingebaut werden. Ein aktiver Player stoppt automatisch beim Start eines anderen Players oder Songs.

Die gekaufte Version bietet weit mehr Möglichkeiten und Designs als die freie Version. Weiterhin kann man durch den Kauf auch den Link zum „Amazing Audio Player“ entfernen. Zum Testen oder für den einfachen Gebrauch ist die freie Version aber sehr gut zu gebrauchen.

Der Player funktioniert auf sämtlichen Geräten in allen Browsern und ist leicht in NOF einzubauen.

www.nof-tutorials.com/Amazing-Audio-Player/

AmazingAudioPlayer

 

YouTube – Videos und die lokale Publizierung in NOF

Vielleicht hat sich der eine, oder andere schon einmal gefragt, wieso nach Einbinden eines Videos von YouTube in der lokalen Publizierung nix zu sehen ist.

Bei YouTube gibt es mehrer Codes, die man in seine Webseite einbauen kann. Ich erkläre es mal an Hand des „Einbettungscodes“.

Selbst bei diesem Einbettungscode gibt es 2 Möglichkeiten, diesen zu erzeugen, einmal mit
„Teilen“ (1.) -> „Einbetten“ (2.) -> „Copy/Paste“

Youtube Einbettungscode2

 

Möglichkeit 2 ist ganz konventionell, auf das Video mit „rechts klicken“ -> „Copy & Paste“ und anschließend z.B. in das HTML eines Textfeldes (Texteigenschaften) einfügen.

Youtube Einbettungscode1

Es wird bei beiden Möglichkeiten ein fast (aber nur fast) identischer Code generiert

 

Hier die 1. Variante (Einbetten):

<iframe width="420" height="315" src="//www.youtube.com/embed/R4U79c-uERg" frameborder="0" allowfullscreen></iframe>

Hier die 2. Variante (Copy & Paste):

<iframe width="420" height="315" src="http://www.youtube.com/embed/R4U79c-uERg?feature=player_detailpage" frameborder="0" allowfullscreen></iframe>

 

Das rot markierte Protokoll „http:“, macht den Unterschied für unsere lokale Publizierung. Während mit „http:“ das Video auch lokal zu sehen ist, funktioniert das nicht mit der 1. Variante. Bei der Fernpublizierung ist das nicht relevant, aber man will es ja vorher lokal testen und auch sehen 😉