Slideshow HTML Code bearbeiten

  • Hallo zusammen,
    ich bin neu hier und habe nur sehr wenig HTML Kenntnisse. Folgender Code beinhaltet eine Slideshow mit 4 Bildern, unter dieser Slideshow werden die 4 Bilder jeweils in einer kleinen Version dargestellt, diesen Passus möchte ich löschen, so dass nur die 4 Bilder in der Slideshow erscheinen. Kann mir jemand dabei helfen?

    <center>
    <div class="topline"></div>
    <div class="group section-wrap upper" id="upper">
    <div class="wrap group">
    <div class="section-2 group">
    <ul id="images" class="rs-slider">
    <li class="group">

    <a href="#"><img src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/slideshow/1.jpg" alt="1" /></a>
    <div class="rs-caption rs-bottom"><p><a href="<?php if ($this->params->get( 'url1' )) : ?><?php echo ($url1); ?><?php endif; ?>">

    </li>
    <li class="group">


    <a href="#"><img src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/slideshow/2.jpg" alt="2" /></a>
    <div class="rs-caption rs-bottom"><p><a href="<?php if ($this->params->get( 'url2' )) : ?><?php echo ($url2); ?><?php endif; ?>"><?php if ($this->params->get( 'slidedesc2' )) : ?><?php echo ($slidedesc2); ?><?php endif; ?></a></p></div>
    </li>
    <li class="group">


    <a href="#"><img src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/slideshow/3.jpg" alt="3" /></a>
    <div class="rs-caption rs-bottom"><p><a href="<?php if ($this->params->get( 'url3' )) : ?><?php echo ($url3); ?><?php endif; ?>"><?php if ($this->params->get( 'slidedesc3' )) : ?><?php echo ($slidedesc3); ?><?php endif; ?></a></p></div>
    </li>
    <li class="group">


    <a href="#"><img src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/slideshow/4.jpg" alt="4" /></a>
    <div class="rs-caption rs-bottom"><p><a href="<?php if ($this->params->get( 'url4' )) : ?><?php echo ($url4); ?><?php endif; ?>"><?php if ($this->params->get( 'slidedesc4' )) : ?><?php echo ($slidedesc4); ?><?php endif; ?></a></p></div>
    </li>

    </ul>
    </div> <!-- /.section-2 -->
    </div> <!-- /.wrap -->
    </div> <!-- /#upper -->
    </center>

    - - - Aktualisiert - - -

    Ich glaube das Problem hat sich eher hier versteckt ( ganz unten steht auch was in die Richtung, jedoch verstehe ich nicht, welchen Teil ich löschen soll )

    .rs-wrap:after,
    .rs-slider:after,
    .rs-thumb-wrap:after,
    .rs-arrows:after,
    .rs-caption:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    line-height: 0;
    visibility: hidden;
    }


    /* ===[ Slider ]=== */
    .rs-slide-bg ul {margin:0px;}
    #images ul {margin:0px;}
    .rs-wrap {
    position: relative;
    max-width: 100%;
    }


    .rs-slide-bg { *zoom: 1 }


    .rs-slider > li > a { display: block }


    .rs-slider > li {
    list-style: none;
    filter: alpha(opacity=0);
    opacity: 0;
    width: 100%;
    height: 100%;
    margin: 0 -100% 0 0;
    padding: 0;
    float: left;
    position: relative;
    }


    .rs-slider > li > a {
    padding: 0;
    background: none;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    }


    .rs-slider > li img {
    display: block;
    max-width: 100%;
    max-height: 100%;
    -ms-interpolation-mode: bicubic;
    }


    /* ===[ Thumbnails ]=== */


    .rs-thumb-wrap { *zoom: 1 }


    .rs-thumb-wrap > a {
    display: block;
    float: left;
    position: relative;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-backface-visibility: hidden; /* Hardware accelerate to prevent jumps on transition */
    }


    .rs-thumb-wrap > a > img {
    max-width: 100%;
    max-height: 100%;
    display: block;
    -ms-interpolation-mode: bicubic;
    }


    .rs-thumb-wrap > a:first-child { margin-left: 0!important }


    /* ===[ Arrows ]=== */


    .rs-arrows .rs-next,
    .rs-arrows .rs-prev { z-index: 1; }


    .rs-arrows:hover .rs-next,
    .rs-arrows:hover .rs-prev { z-index: 2; }
    /* ===[ Captions ]=== */
    .rs-caption {
    position: absolute;
    max-height: 100%;
    overflow: auto;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    bottom: 0;
    left: 0;
    }
    .rs-caption p a {color:#fff;}


    .rs-caption.rs-top-left {
    top: 0;
    bottom: auto;
    }


    .rs-caption.rs-top-right {
    top: 0;
    right: 0;
    left: auto;
    bottom: auto;
    }


    .rs-caption.rs-bottom-left {
    bottom: 0;
    left: 0;
    }


    .rs-caption.rs-bottom-right {
    right: 0;
    left: auto;
    border-bottom: none;
    border-right: none;
    }


    .rs-caption.rs-top {
    top: 0;
    bottom: auto;
    width: 100%!important;
    }


    .rs-caption.rs-bottom { width: 100%!important }


    .rs-caption.rs-left {
    top: 0;
    height: 100%;
    }


    .rs-caption.rs-right {
    top: 0;
    left: auto;
    right: 0;
    height: 100%;
    }


    /* ===[ Grid ]=== */


    .rs-grid {
    position: absolute;
    overflow: hidden;
    width: 100%;
    height: 100%;
    display: none;
    }


    .rs-gridlet {
    position: absolute;
    opacity: 1;
    }


    /* Optional - remove captions at smaller screen widths
    @media screen and (max-width: 480px) {
    .rs-caption { opacity: 0!important; }
    }
    */

  • offensichtlich geht es hier um die thumbnails im div mit der klasse "rs-thumb-wrap"

    du kannst dem rs-thumb-wrap nen display:none; im css geben und dann behät es etwaige funktionen, wird aber ausgeblendet.

    ansonsten wäre jetzt ein durchsuchen des javascripts nach entsprechendem passus nötig, hier in deinem code habe ich den part nicht gefunden und bei deaktiviertem js sieht man entsprechendes div auch nicht im DOM.


    das javascipt zu verändern ist nicht ratsam, denn damit könntest du ggf gegen urheberrechte oder lizenzen verstossen :)

  • Bearbeite die Datei http://sportverein-grosswudicke.de/templates/real…-theme-dark.css.
    Nimm folgendes raus:

    .rs-caption {
    padding: 8px;
    color: #fff;
    text-shadow: 0 -1px 0 #000;
    border: 1px solid #000;
    background: url(../img/black60.png);
    background: rgba(0, 0, 0, .6);
    background: -moz-linear-gradient(top, rgba(0, 0, 0, .45), rgba(0, 0, 0, .7));
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, .45), rgba(0, 0, 0, .7));
    background: -o-linear-gradient(top, rgba(0, 0, 0, .45), rgba(0, 0, 0, .7));
    background: -ms-linear-gradient(top, rgba(0, 0, 0, .45), rgba(0, 0, 0, .7));
    background: linear-gradient(top, rgba(0, 0, 0, .45), rgba(0, 0, 0, .7));
    -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, .12) inset;
    -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, .12) inset;
    box-shadow: 0 1px 0 rgba(255, 255, 255, .12) inset;
    }


    Dann ist der graue Streifen unter dem Slider zumindest weg.
    Dann sorge dafür, das keiner mehr die CSS Datei im Browser abrufen kann.

  • ... beinhaltet eine Slideshow mit 4 Bildern, unter dieser Slideshow werden die 4 Bilder jeweils in einer kleinen Version dargestellt, diesen Passus möchte ich löschen, so dass nur die 4 Bilder in der Slideshow erscheinen...

    was hat der Threadersteller:
    a) davon, wenn er die caption ohne style hat?
    b) wenn er dafür sorgt, dass eine ganze css-datei nicht mehr aufrufbar ist


    und wieso willst du, dass er an der caption fummelt, wenn es doch eh um die thumbnails geht?
    du hast ja mindestens so viel plan von der front-end-materie, wie ich von raketentechnik (nen limes unendlich gegen null!)

  • Aber die Vorschaubilder sind doch schon weg. Es geht doch nur noch darum den Platz dafür und die anklickbaren Felder wegzukriegen.
    Und ich lasse die CSS Dateien zwar funktional stets intakt. Sie sind aber im Browser beim Aufrufen nicht lesbar.

    Einmal editiert, zuletzt von angeldbh (25. Dezember 2013 um 10:29)

  • der wrapper der thumbs ist aber noch immer da und verbraucht unnötig platz, wenn die thums eh nicht gezeigt werden sollen.

    und wie im von mir zitierten teil steht: es geht um die vorschaubilder, nicht den caption-text.

    tankst du auto voll, wenn du eigentlich neue reifen brauchst??