Der gewünschte effeckt, mag bei mir nicht klappen

SpamXmapS

Ich möchte gleich sagen, ich bin kein Profi [Blockierte Grafik: http://www.html.de/images/smilies/icon_smile.gif]

Ich habe gestern im Internet etwas gefunden iCarousel - Simple news ticker (Mal Top und Bottom klicken, für den effeckt, den ich auch haben mag)
Da es in ein Forum soll, habe ich es in eine tabelle gesetzt und werde nur den codschnippsel zeigen, der zu diesen teil des Forum gehört und später eingesetzt wird.
Mein Problem besteht darin, das ich es zwar so hinbekommen habe es ein zu fügen, aber der effeckt der IV. Vertical images scroller funktioniert nicht [Blockierte Grafik: http://www.html.de/images/smilies/icon_sad.gif] Da ich es euch nicht per link auf eine seite zeigen kann, werde ich den code schnippsel so wie ich ihn habe jetzt mal zeigen (Bilder werden später ersetzt

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="UTF-8">
<head>
<title>Zellen spalten- und zeilenweise zugleich verbinden</title>

<script type="text/javascript">


window.addEvent("domready", function() {
    //new Accordion($$(".accordion_toggler"), $$(".accordion_content"));


    dp.SyntaxHighlighter.HighlightAll("usage");


    new iCarousel("example_4_content", {
        idPrevious: "example_4_previous",
        idNext: "example_4_next",
        idToggle: "undefined",
        item: {
            klass: "example_4_item",
            size: 86
        },
        animation: {
            direction: "top",
            duration: 250,
            amount: 1
        }
    });
});


</script>
<style type="text/css">


#example_4 {
    position: relative; /* important */
    overflow: hidden; /* important */
    width: 172px; /* important */
    height: 212px; /* important */
    background: #000;
}


#example_4_frame {position: relative}
#example_4_frame img {position: absolute;}
#example_4_previous {top: 0; left: 0;}
#example_4_next {top: 192px; left: 0;}


#example_4_content {
    position: absolute;
    margin-top: 20px;
    left: 0;
}


.example_4_item img {
    display: block;
    float: left;
    margin: 5px;
    padding: 5px;
    border: 1px solid #666;
    background-color: #000;
}


</style>
</head>
<body>


<table border="0">
  <tr>
    <td>Vom eigenen Computer hochladen:</td>
    <td><input type="file" name="avatar_upload"  class="inputbox" id="avatar_upload" onChange="if(this.value)  document.getElementById('avatar_url').value='';"></td>
    <th rowspan="3">
    </br>
    <div id="example_4">
        <div id="example_4_content">
            <div class="example_4_item">
                <a href="#"><img  src="http://zendold.lojcomm.com.br/icarousel/images/flowers/1.jpg"  alt="flower 1" /></a>
                <a href="#"><img  src="http://zendold.lojcomm.com.br/icarousel/images/flowers/2.jpg"  alt="flower 2" /></a>
            </div>
            <div class="example_4_item">
                <a href="#"><img  src="http://zendold.lojcomm.com.br/icarousel/images/flowers/3.jpg"  alt="flower 1" /></a>
                <a href="#"><img  src="http://zendold.lojcomm.com.br/icarousel/images/flowers/4.jpg"  alt="flower 2" /></a>
            </div>
            <div class="example_4_item">
                <a href="#"><img  src="http://zendold.lojcomm.com.br/icarousel/images/flowers/5.jpg"  alt="flower 1" /></a>
                <a href="#"><img  src="http://zendold.lojcomm.com.br/icarousel/images/flowers/6.jpg"  alt="flower 2" /></a>
            </div>
            <div class="example_4_item">
                <a href="#"><img  src="http://zendold.lojcomm.com.br/icarousel/images/flowers/7.jpg"  alt="flower 1" /></a>
                <a href="#"><img  src="http://zendold.lojcomm.com.br/icarousel/images/flowers/8.jpg"  alt="flower 2" /></a>
            </div>
            <div class="example_4_item">
                <a href="#"><img  src="http://zendold.lojcomm.com.br/icarousel/images/flowers/9.jpg"  alt="flower 1" /></a>
                <a href="#"><img  src="http://zendold.lojcomm.com.br/icarousel/images/flowers/A.jpg"  alt="flower 2" /></a>
            </div>
            <div class="example_4_item">
                <a href="#"><img  src="http://zendold.lojcomm.com.br/icarousel/images/flowers/B.jpg"  alt="flower 1" /></a>
                <a href="#"><img  src="http://zendold.lojcomm.com.br/icarousel/images/flowers/C.jpg"  alt="flower 2" /></a>
            </div>
            <div class="example_4_item">
                <a href="#"><img  src="http://zendold.lojcomm.com.br/icarousel/images/flowers/D.jpg"  alt="flower 1" /></a>
                <a href="#"><img  src="http://zendold.lojcomm.com.br/icarousel/images/flowers/E.jpg"  alt="flower 2" /></a>
            </div>
            <div class="example_4_item">
                <a href="#"><img  src="http://zendold.lojcomm.com.br/icarousel/images/flowers/F.jpg"  alt="flower 1" /></a>
                <a href="#"><img  src="http://zendold.lojcomm.com.br/icarousel/images/flowers/G.jpg"  alt="flower 2" /></a>
            </div>
            <div class="example_4_item">
                <a href="#"><img  src="http://zendold.lojcomm.com.br/icarousel/images/flowers/H.jpg"  alt="flower 1" /></a>
                <a href="#"><img  src="http://zendold.lojcomm.com.br/icarousel/images/flowers/I.jpg"  alt="flower 2" /></a>
            </div>
            <div class="example_4_item">
                <a href="#"><img  src="http://zendold.lojcomm.com.br/icarousel/images/flowers/J.jpg"  alt="flower 1" /></a>
                <a href="#"><img  src="http://zendold.lojcomm.com.br/icarousel/images/flowers/K.jpg"  alt="flower 2" /></a>
            </div>
        </div>
        <div id="example_4_frame">
            <img id="example_4_previous"  src="http://zendold.lojcomm.com.br/icarousel/images/ex4_previous.gif"  alt="move previous" />
            <img id="example_4_next" src="http://zendold.lojcomm.com.br/icarousel/images/ex4_next.gif" alt="move next" />
        </div>
    </div>
    </br>
    </th>
  </tr>
  <!-- usw. andere Zeilen der Tabelle -->
    <tr>
    <td>Internet-Adresse verwenden:</td>
    <td><input type="text"  name="userimg" class="inputbox"  value="{{portrait}}" id="avatar_url" onChange="if(this.value)  document.getElementById('avatar_upload').value='';"></td>
  </tr>
  <!-- usw. andere Zeilen der Tabelle -->
    <tr>
    <td></td>
    <td><input type="submit" value="Speichern" name="edit_again" class="button1" ></td>
  </tr>
  <!-- usw. andere Zeilen der Tabelle -->
</table>
</body>
</html>

Alles anzeigen

Bei mir mag irgentwie der scrolleffeckt, wie auf der seite link oben, nicht funktionieren [Blockierte Grafik: http://www.html.de/images/smilies/icon_sad.gif]

Es were nett, wen ihr mir da helfen könntet [Blockierte Grafik: http://www.html.de/images/smilies/icon_smile.gif] Danke schon mal [Blockierte Grafik: http://www.html.de/images/smilies/icon_smile.gif]

Anhang: Wen es fungtionieren sollte, könnte man dan, wen man auf ein bild klickt, das der bildlink, im 2 inputfeld erscheint, könnte man das auch so machen ? were nett für tips und trix [Blockierte Grafik: http://www.html.de/images/smilies/icon_smile.gif]
html anfänger, js anfänger, css anfänger [Blockierte Grafik: http://www.html.de/images/smilies/icon_smile.gif]

synaptic

ja dann binde doch einfach mal mootools ein.. ich bin sicher, dass es dann fruchtet...

wenn man nen script nutzen möchte was auf ne lib oder nen framework aufbaut, ergibt es immer sinn dann entsprechendes auch einzubauen

SpamXmapS

Also ich habe jetzt erstmal das eingefügt mit oben:

es geht immernoch nicht

synaptic

ja dann musste geduld mitbringen.. für ne richtige recherche fehlt mir heut abend die zeit..
es sei denn du kommst nach wehrheim, wäschst wäsche, machst mein abendessen und programmierst mein anmeldeformular zu ende, dann hab ich zeit zum durchforsten deiner coderei

sry

SpamXmapS

Also zu dir kommen werde ich nicht, aber in meinen Gedanken, bin ich bei dir und schaue dir zu hahaha ne spaß bei seite XD (... Were kein problem ...wäschst wäsche, machst mein abendessen ...) XD

Es muss ja auch nicht heute sein, aber es würde mich schon sehr freuen, wen es irgenwann mal zum laufen kommt Aber es freut mich, das gezeigt wird, das intresse besteht danke schon mal

Unregistriert

Ich habe es herrausgefunden es fehlten noch andere bestimmte js

nun habe ich aber noch eine frage und zwar, wie bekomme ich das hin, das wen ich auf ein bild klicke, der bildlink in einer inputbox erscheint ?

Grevas

Prinzip:

HTML

<script>
function img_clicked(id) {
  var src = document.getElementById(id).getAttribute('src');
  document.getElementById('link_text').innerHTML = '<a href="' + src + '">Bildlink</a>';
}
</script>


<img id="my_id" onclick="javascript:img_clicked('my_id')" src="img.jpg" />
<textarea id="link_text">


</textarea>

Alles anzeigen

SpamXmapS

vielen dank für die antwort danke

Der gewünschte effeckt, mag bei mir nicht klappen

Tags

Benutzer online in diesem Thema