• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

[ERLEDIGT] CSS/jQuery Slider

L

Lucaper

Neues Mitglied
Moin,

bin mir garnicht so sicher ob ich in einem Forum Namens html.de damit überhaupt richtig bin...

Aaaalso, ich habe vor, auf meiner Website einen Slider einzubauen. Bin nach stundenlanger Recherche auf http://unslider.com/ gestoßen. Ich leg sehr viel Wert darauf das der Slider in einem Flat Look gehalten ist, und bisher konnte ich keinen schöneren finden als den bei unslider.

Jetzt bin ich aber blutiger Anfänger, habe gerade so HTML, CSS und javascript Basicwissen. Mag mir vielleicht jemand erklären, gerne auch über einen Chat wie Skype oder so, was es mit diesem jQuery auf sich hat, was scheinbar die Vorraussetzung für meinen Slider ist? Hab mir schon zich Youtube-Videos angeschaut und mich durch mindestens genauso viele Foren geklickt, aber werde nicht schlauer...Ich will doch nur diesen doofen Slider auf meiner Website integrieren >.<

LG
Lucaper
 
Werbung:
Lucaper schrieb:
bin mir garnicht so sicher ob ich in einem Forum Namens html.de damit überhaupt richtig bin...
Zum Vergrößern anklicken....
Wir behandeln hier nicht ausschließlich HTML ;)
Lucaper schrieb:
Mag mir vielleicht jemand erklären [...], was es mit diesem jQuery auf sich hat, was scheinbar die Vorraussetzung für meinen Slider ist?
Zum Vergrößern anklicken....
https://jquery.com/ ist eine JavaScript-Bibliothek (Framework), die Funktionen zur DOM-Navigation u. -Manipulation bereitstellt, und dem Entwickler diverse Arbeiten abnimmt.

Der auserkorene Slider ist somit ein sog. jQuery-Plugin (Erweiterung).
Lucaper schrieb:
Hab mir schon zich Youtube-Videos angeschaut und mich durch mindestens genauso viele Foren geklickt, aber werde nicht schlauer...Ich will doch nur diesen doofen Slider auf meiner Website integrieren
Zum Vergrößern anklicken....
Nach dem Download einfach den Anleitungen unter "Installing & Setting Up" folgen, und der Slider ist mit wenigen Handgriffen in der Seite eingerichtet.
 
Werbung:
Lucaper schrieb:
Ja, aber der unslider setzt ja jQuery vorraus. Und das krieg ich schon nicht gesch*ssen :(
Zum Vergrößern anklicken....
Verstehe nicht, wo hier das Problem liegt, die wenigen Code-Zeilen in einem Dokument einzufügen.
HTML: 
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>...</title>
    <link rel="stylesheet" href="unslider.css" />
    <link rel="stylesheet" href="unslider-dots.css" />
    <!-- optionales CSS, damit die weißen "unslider-dots" sichtbar werden -->
    <style>body {background:#333}</style>
  </head>
  <body>
    <div class="my-slider">
       <ul>
         <li>My slide</li>
         <li>Another slide</li>
         <li>My last slide</li>
       </ul>
    </div>
    <script src="//code.jquery.com/jquery-2.1.4.min.js"></script>
    <script src="unslider-min.js"></script>
    <script>
    jQuery(document).ready(function($) {
      $('.my-slider').unslider();
    });
    </script>
  </body>
</html>
Falls Du das nicht auf einem Webserver oder lokal mit XAMPP durchspielst, füge in dieser Zeile das HTTP-Protokoll ein:
HTML: 
 <script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
 
Spicelab schrieb:
Verstehe nicht, wo hier das Problem liegt
Zum Vergrößern anklicken....
Das Problem ist wohl das ich blutiger Anfänger bin und erst vor ca. nem Monat meine erste .html Datei ever erstellt habe :p.
Wie auch immer, ich habe mal ein paar Parts von deinem Code bei mir eingefügt und entsprechend angepasst (Ordnerstruktur). Und jetzt sieht man im Browser tatsächlich die ersten Bilder durchsliden :) Vielen vielen Dank!!! :)
Spicelab schrieb:
Falls Du das nicht auf einem Webserver oder lokal mit XAMPP durchspielst, füge in dieser Zeile das HTTP-Protokoll ein:
Zum Vergrößern anklicken....

Was du damit meinst kapier ich allerdings nicht :x
Nein, einen Webserver hab ich nicht und XAMPP kenne ich garnicht. Habe das ganze jetzt ohne HTTP-Protokoll gemacht, und scheint trotzdem zu funzzen...
 
Lucaper schrieb:
Was du damit meinst kapier ich allerdings nicht :x
Nein, einen Webserver hab ich nicht und XAMPP kenne ich garnicht. Habe das ganze jetzt ohne HTTP-Protokoll gemacht, und scheint trotzdem zu funzzen...
Zum Vergrößern anklicken....
Bei mir verhält es sich (unter Win7) ohne HTTP-Protokoll so, dass das jQuery-Script nicht geladen wird, wenn die Seite nicht vom lokalen Webserver (= XAMPP) aus aufgerufen wird (Browser-Adreßzeile: http://localhost/unslider.html).

Liegt die Seite bspw. auf dem Desktop und wird dort geöffnet (Browser-Adreßzeile: file:///C:/Users/UserName/Desktop/unslider.html), ist in dem Pfad das HTTP-Protokoll erforderlich.
 
Werbung:
Spicelab schrieb:
Liegt die Seite bspw. auf dem Desktop und wird dort geöffnet (Browser-Adreßzeile: file:///C:/Users/UserName/Desktop/unslider.html), ist in dem Pfad das HTTP-Protokoll erforderlich.
Zum Vergrößern anklicken....

Hmm ich öffne sie immer vom Desktop auf, und es funktioniert obwohl ich das HTTP-Protokoll nirgends erwähnt habe.
 
Werbung:
Einfach auf der Console in das entsprechende Verzeichnis dirigieren und dort eingeben:
python -m SimpleHTTPServer 3000

Damit hast du einen Webserver auf localhost:3000
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben