Zum Inhalt springen
View in the app

A better way to browse. Learn more.

Fachinformatiker.de

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Bilder wie bei Ebay anzeigen...

Empfohlene Antworten

Veröffentlicht

Hi,

ich bräuchte ein kleines Javscript, mit dem man Bilder wie bei Ebay anzeigen kann. Also in der Mitte ein Standardbild, daneben 2 oder 3 Thumbnails, die sich bei Klick in der Mitte anzeigen.

Es muss nicht die Möglichkeit haben Bilder upzuloaden, einfach vorhandene Bilder so darstellen, vielleicht von vorhandenen Bildern Thumbnails generieren können.

Wie kann ich sowas realisieren??

Vielen Dank

StMi

ajo wenn du eins haben willst wie bei ebay, dann geh doch auf die site und schau in den sourcen nach den funktionen dafür

  • Autor

Das habe ich teilweise schon gemacht, aber bei Ebay sind die Seiten dermaßen lang und umfangreich, dass man kaum durchsieht. Und wenn man dann nicht so fit in JS ist, bringt man schnell einiges durcheinander und dan funzt gar nix mehr... trotzdem danke für den Tip.

Bin dankbar für weitere postings!

  • Autor

Also, ich habe jetzt erstmal klein angefangen (mit Hilfe eines Tutorials) und auch schon was hinbekommen.

Nun nur folgendes: Meine Bilder werden zwar als Thumbnails erkennbar, aber nicht (bei Klick) als großes Bild angezeigt. Was mache ich falsch? So und dann ist das ganze ja noch auf ein Frameset basiert, das würde ich aber gerne in nur einer Html-Seite haben, wie muss ich da rangehen? Wie kann ich das realisieren?

Hier der Code:


...

  <script type="text/javascript">

    var thumbs = new Array('beispiel.jpg', 'aerzte.jpg','asus_a7n.jpg','southpark.jpg');

    var thumbs_desc = new Array('XXX YYY ZZZ','BLINDTEXT','BLA','BLUB');

    var h = 100; //höhe des Thumbnails

    var w = 100; //breite des Thumbnails

    var spacer = 40;


    function setHighlight(tags){

      if(tags.indexOf(',')!=-1){

        var tag = tags.split(',');

        var x = document.getElementsByTagName(tag[z]);

      }else{

        var tag = tags;

        var x = document.getElementsByTagName(tag);

      }

      for(z=0;z<tag.length;z++){

        var y = x.length;

        for(i=0;i<y;i++){

          x[i].onmouseover = new Function("this.style.filter = 'progid:DXImageTransform.Microsoft.Alpha(opacity=100)';");

          x[i].onmouseout = new Function("this.style.filter = 'progid:DXImageTransform.Microsoft.Alpha(opacity=50)';");

        }

      }

    }


    function swap(id,desc){

     parent.galery.document.images[0].src=id;

     parent.gallery.document.getElementById('beschreibung').innerHTML=thumbs_desc[desc];

    }


  </script>


</head>

<body onload="setHighlight('img')" onselectstart="return false" ondragstart="return false" oncontextmenu="return false">

  <table cellpadding="0" cellspacing="0">

    <tr>

    <script type="text/javascript">

    <!--

      for(var x=0; x<thumbs.length; x++){

        document.write('<td><img src="'+thumbs[x]+'" id="'+thumbs[x]+'" width="'+w+'" height="'+h+'" onclick="swap(this.id,'+x+')" /></td>');

        document.write('<td><img src="spacer.gif" width="'+spacer+'" height="1" /></td>');

      }

...

Archiv

Dieses Thema wurde archiviert und kann nicht mehr beantwortet werden.

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.