Slider in einer Seite oder einer Zusatzbox erstellen

Ich kopiere also die beiden Dateien in die angegebenen Ordner und code von der original index.html ohne die links für script in mein index content. Habe ich das richtig verstanden?
Wenn ja dann habe ich irgendwas falsch gemacht den außer anzeige der Bilder untereinander passiert nichts

 

@postel
Du hast ja bei Dir eigene Prev-Next-Bilder eingebaut, hättest du da evtl. mal ne die CSS für mich?
LG
Patrick

 

Für welchen Slider in deinem Sop?

 

Bastle grad nen kleinen Slider für Beispielhufeisen, der dann auf die Index soll...
Testseite:
https://www.hufeisen-kontor.de/info/test.html

 

Hatte gestern mal bei Dir geschaut und versucht ebenfalls 2 Grafiken als "background" für die Navs zu hinterlegen, das beißt sich aber noch irgendwie noch mit den anderen CSS angaben für die Slider-Nav (Nav-Bilder werden dann nicht mehr angezeigt...)

 

Die CSS sieht grad so aus (BG-Bilder wieder entfernt)

Code:

.nbs-flexisel-container {
    position:relative;
    max-width:100%;
}
.nbs-flexisel-ul {
    position:relative;
    width:99999px;
    margin:0px;
    padding:0px;
    list-style-type:none; 
    text-align:center;
    overflow: auto;
}

.nbs-flexisel-inner {
    position: relative;
    overflow: hidden;
    float:left;
    width:100%;
    background:#ffffff;
}

.nbs-flexisel-item {
    float:left;
    margin:0px;
    padding:0px;
    cursor:pointer;
    position:relative;
    line-height:0px;
}
.nbs-flexisel-item img {
    max-width: 100%;
    cursor: pointer;
    position: relative;
    margin-top: 10px;
    margin-bottom: 10px;
}

/*** Navigation ***/

.nbs-flexisel-nav-left,
.nbs-flexisel-nav-right {
    padding:5px 10px;
    border-radius:15px;
    -moz-border-radius:15px;
    -webkit-border-radius:15px;   
    position: absolute;
    cursor: pointer;
    z-index: 4;
    top: 50%;
    transform: translateY(-50%); 
    background: #eeeeee;
    color: #81B217;   
}

.nbs-flexisel-nav-left {
    left: 5px;
}

.nbs-flexisel-nav-left:before {
    content: "<"
}

.nbs-flexisel-nav-left.disabled {
    opacity: 0.4;
}

.nbs-flexisel-nav-right {
    right: 5px; 
}

.nbs-flexisel-nav-right:before {
    content: ">"
}

.nbs-flexisel-nav-right.disabled {
    opacity: 0.4;

 

sind eigentlich nur wenige css-angaben notwendig:

Code:

/*** Navigation ***/
.nbs-flexisel-nav-left,
.nbs-flexisel-nav-right {
    width: 39px;
    height: 44px;
    position: absolute;
    cursor: pointer;
    z-index: 100;
    opacity: 0.6;
}

.nbs-flexisel-nav-left {
    left: 3px;
    background: url('/Slider-Index/images/button-previous.png') no-repeat;
}

.nbs-flexisel-nav-right {
    right: 3px;
    background: url('/Slider-Index/images/button-next.png') no-repeat;
}

und nicht mehr

 

Nee, leider nicht. So ist die ganze Nav verschwunden...
Muss da evtl im JS noch was angepasst werden?

 

('/Slider-Index/images/button-previous.png')
hast du den Pfad zu den Bildern angepasst, bzw. auch entsprechende Bildchen?
Im JS habe ich nichts angepasst

 

Jup! Auch Caches geleert etc...hmmm

 

über FTP beide Caches leeren, dann sind noch die Browser-Cache sehr sehr hartnäckig

 

CSS nochmal umgebaut, jetzt läuft das Mäusekino!