WorldWideScripts.net Delivering the best Add-Ons in more than 37 languages.

中文(简体), English, हिन्दी/हिंदी, Español/Castellano, العربية, Русский язык, Français, 中文 (台灣), বাংলা, Bahasa Indonesia, اردو, Português, Deutsch, Bahasa Melayu (بهاس ملايو‎), 日本語 (にほんご), فارسی, Italiano, తెలుగు, Türkçe, ગુજરાતી, Język polski/polszczyzna, Tiếng Việt, ಕನ್ನಡ, Українська мова, ไทย
HTML5 / Media

ZoomSounds - neat HTML5 Audio Player

— Add-On auf WorldWideScripts.net

@de1wwsAbonniere den Feed um auf dem neuesten Stand zu bleiben!

Neu! Folge uns, wie Du es möchtest!


ZoomSounds - neat HTML5 Audio Player - CodeCanyon Item for Sale

Ads

Ad: Bluehost hosting

Audio Player Intro

Möchten Sie eine raffinierte, modernste, Retina-ready, reaktions html5 Audio-Player für Ihre Website? ZoomSounds ist der perfekte Kandidat. Mit drei Häute jede Marke passen, nur ein Format ZoomSounds zu funktionieren, benötigt

Neu - Mit Play

Neu - WP Version

Audio-Player verfügt über

  • HTML5 - Technologie - diese Galerie nutzt die neuesten html5 tehniques ein liefern nie zuvor Erfahrung für Ihre Kunden gesehen
  • voll ansprechbar - sieht gut aus von Handy zu HD
  • Flash - Backup - IE7 und IE8 nicht unterstützen html5, aber die Benutzer nicht Vergessenes, werden die Töne auch für sie über den Flash Player spielen
  • ein obligatorisches Format - der schwierige Teil ist von dem Spieler - Skript, um für den Benutzer gemacht einfache Erfahrung Bearbeitung zu haben - nur mp3 erforderlich ist
  • Touch optimiert - Touch - Geräte sind nicht vergessen
  • fünf Häute - für jeden Bedarf
  • drei Häute - drei volle Häute jede Marke passen
  • CSS3 - Technologie - zu diesem Spieler nutzt modernste css3 Definitionen
  • einfach zu installieren - Kauf, den Zip - Download, lesen Sie die Dokumentation
  • iPhone / iPad optimiert - diese Galerie hat für Apple Touch - Geräte optimiert
  • Android optimiert - wurde diese Komponente auf Android 4.0 getestet und funktioniert super
  • Entwickler / SASS angetrieben - das CSS die Komponente auf der SASS gebaut worden, was bedeutet, SASS Benutzer eine einfache Zeit, um die Häute zu modifizieren haben. Für Nicht-SASS Benutzer ist es kein Problem, weil CSS-Dateien (erzeugt durch SASS) vorgesehen sind
  • spielt von YouTube - Streams YouTube - Audio
  • spielt von Soundcloud - Streams Soundcloud - Audio mit einem API - Schlüssel
  • 100% css skinable - wollen geringfügige Änderungen an den Fellen zu machen? Die Felle werden zu 100% von der CSS aufgebaut und es ist sehr einfach mit CSS Kenntnisse bearbeiten
  • SEO freundlich - gebaut mit Suchmaschinen - Optimierung auf den Geist von Grund auf, verwendet die Testimonial Rotator nicht gültig HTML - Markup versteckt das Widget zu bauen
  • kompatibel mit allen gängigen Browsern, einschließlich IE - kompatibel von IE7 auf IE10, Chrome, Safari und Firefox

Mobil Optimized

Glatte auf dem Handy auch wegen
Hardware-Beschleunigung. Chrome ab Android 4.4
und iOS testedto liefern superglatt
Erfahrung

Video ansehen

Audio-Player-Updates

UPDATE 2.01 [2015.09.07]
  • [UPDATE] verschiedene Fixes
UPDATE 2.00 [2015.01.20]
  • [ADD] hinzugefügt Haut-Arie
  • [ADD] hinzugefügt im Menü Bewegung enable_easing Option
  • [ADD] hinzugefügt Ereignis Google Analytics zum Spielen
  • [ADD] Option zum Ändern der Song in einem Spieler (+ API-Aufruf)
  • [ADD] Galerie Haut - Haut-default oder Haut-Welle
  • [TWEAK] geändert Haut Wellenmodus glatt Layout von der absoluten zur relativen
UPDATE 1.62 [2014.07.03]
  • [UPDATE] autoplayNext gezwungen Autoplay auf
UPDATE 1.50 [2014.04.02]
  • [ADD] Haut-pro
  • [TWEAK] aktualisierte Vorschau
  • [UPDATE] einige Fehler in Safari
UPDATE 1,40 [2014.01.15]
  • [ADD] Jetzt können Kommentare angezeigt werden, wenn der Schrubbkopf über es ist
  • [ADD] Haut-justthumbandbutton
  • [ADD] neue Stick nach unten Modus
  • [ADD] neue Slick-Modus für die Haut-Welle
  • [TWEAK] aktualisierte Vorschau
  • [UPDATE] einige Bugs
UPDATE 1.10 [2013.06.06]
  • [Hinzufügen] Alle neuen Flash-Generator für die Wellenformen [die alte html5 einige Kompatibilitätsprobleme hatten]
  • [Update] Kompatibilitätsprobleme

Audio Player Zusätzliche Features

Völlig kundengerecht.
Sie können scrubbar, Lautstärkeregler, Vollbild-Kontrollen Miniatur und mehr deaktivieren. Sie können alle Farben per CSS anpassen. Der Spieler auf der linken Seite verwendet die zweite Haut des Spielers. Die erste Haut ist die Schallwelle Haut an der Spitze.
Retina bereit.
Jede Haut ist voll ansprechbar und Retina-ready. Beeindruckend. Der Spieler selbst wurde IE7-10 auf allen gängigen Browsern, Firefox, Chrome, Opera, Safari, getestet. Und für die iOS und Android mobile Plattformen optimiert.
Minimal-Player.
Manchmal mehr ist weniger, und dieser Spieler hat bedeckt jedes Szenario. Dies ist in der rechten Seite ist die Darstellung der dritte Haut des Spielers, eine minimale Implementierung, die selbst schrubben Kontrollen hat (wenn Sie auf die Margen klicken).
Nur ein Format.
Todays html5-Audio-Player erfordert, die Welt in verschiedene Audio-Formate. Aber nicht diese. Nur mp3 ist erforderlich und ogg ist optional.
Smart.
Sie können so viele Spieler auf einer Seite platzieren, wie Sie es wünschen. Wenn ein anderer Spieler spielt, und Sie auf einer anderen klicken, wird der andere Spieler aufhören zu spielen, versuchen Sie einfach hier.
Mehrere Quellen.
Selbst gehostete Audios sind nicht Ihre einzige Option. Sie können auch Ströme von YouTube oder Soundcloud spielen oder sogar Shoutcast- Radiosender *

* (Für Shoutcast-) - Sie müssen zuerst überprüfen, ob der Strom audio / mpeg ist. Nehmen wir zum Beispiel nehmen http://streamplus40.leonex.de:41364/if Sie diese in einem Browser geöffnet werden Sie, dass Inhalte - Typ: audio / mpeg
Signalgenerator

Es gibt mindestens drei Methoden Wellenformen zu erzeugen,

  • erzeugen Wellenformen mit einem Admin-Panel (waveformgenerator.php) -, auf denen können Sie Farbe, Multiplikator ändern, verfolgen locatinon etc / Flash-basiert
  • erzeugen Wellenformen für alle mp3s in einem Ordner (wavegeneratorfromdir.php) / Flash-basiert
  • erzeugen Wellenform für song.mp3 zu wavesbg.png und wavesprog.png - statisch (waveform.html) - Sie, dass HTML für verschiedene Farben bearbeiten, Namen / Flash-basiert
  • waveformgenerator_html / für die Verwendung des html5 Signalgeneratoren / html5 basiert, ich das nicht im Moment unterstützen

Präsentation für die ersten beiden Verfahren - https://youtu.be/WrTSB54oTkI

Notizen

  • Spuren und Bilder werden nicht im Download-Paket enthalten.
  • Kommentarsystem verwenden Sie PHP-Server benötigt,
  • youtube nicht als Audio auf iDevices arbeiten, aber als Video aufgrund der Plattformeinschränkungen
  • die Wellenform ist ein statisches Bild, um es nicht automatisch durch den Audio-Player, sondern durch ein Werkzeug enthalten im Download-Paket erzeugt wird. Eine vollständige Anleitung zur Verfügung gestellt werden, wie dies zu tun und es ist ein 10 Sekunden Job für jede Spur, fast automatisch, wenn Sie alle Ihre Spuren in einem Verzeichnis.

FAQ

In der kleineren Spieler (der Kreis Spieler auf der rechten Seite der Demo-Seite) Ich möchte in der Lage sein, die ganze Spieler größer zu machen. Statt 100px / 100px würde ich 500px / 500px mögen. Wo finde ich das ändern? Ich habe die Leinwand bearbeitet, aber es hat kleiner geworden!
Editieren Sie einfach die 100 Breite und 100 Höhe in diesem Stück Code, und Sie sollten in Ordnung sein (line ~ 377)
 . _conPlayPause.children ( '. PlayBtn') anhängen ( '<canvas width = "100" height = "100" class = "playBtn-Leinwand" />'); skin_minimal_canvasplay = _conPlayPause.find ( 'playBtn-Leinwand.') eq (0).get (0). . _conPlayPause.children ( '. PauseBtn') anhängen ( '<canvas width = "100" height = "100" class = "pauseBtn-Leinwand" />'); 
kann dies / tut dies binden an das <audio> -Tags?
Es gibt keine Möglichkeit, an den Audio-Tag zu binden,

Es wird eine Audio-Tag durch seine eigene erstellen

aber ich denke, das Format ist ziemlich einfach

 <Div id = "apsimple" class = "Audioplayer-tobe" style = "width: 100%; margin-top: 0;" Daten-videotitle = "Audio Video" data-type = "normal" data-source = "./ Töne / adg3.mp3"> <Div class = "Meta-Künstler"> <span class = "the-Künstler"> Tim McMorris </ span> - Es ist ein schöner Tag </ div> </ Div> <Script> jQuery (document).ready (function ($) { dzsap_init ( "# apsimple", { Automatische Wiedergabe: "off" }); }); </ Script> 
gibt es eine Möglichkeit, MPEG-Datei-Format Audio-only zu akzeptieren?

Sie können wie in dem Beispiel nur.mp3 als Stream haben oben und es wird das Flash-Backup für nicht unterstützte Browser

Credits

Andere Super Produkte


Herunterladen
Weitere Komponenten in dieser KategorieAlle Komponenten dieses Autors
KommentareHäufige Fragen und Antworten

Eigenschaften

Erstellt:
15. April 13

Letztes Update:
19. März 16

Hohe Auflösung:
ja

kompatible Browser:
IE7, IE8, IE9, IE10, IE11, Firefox, Safari, Opera, Chrome

Dateien inklusive:
JavaScript JS, HTML, CSS

Softwareversion:
HTML5

Stichworte

E-Commerce, E-Commerce, Alle Elemente, Audio-, Audio-Abspielgerä, t, Audio-Player, Musikabspielgerä, t, Segeltuch, css3, anpassbare, html5, jquery, Medien, minimal, Spieler, Lied, Soundcloud, Gerä, usche, Welle, Youtube