codice della presentazione

[rozalia]

Ciao, 
ho bisogno di aiuto: voglio un'icona di visualizzazione dell'immagine, come quella nell'immagine

https://i.postimg.cc/B6LVdfCd/froru.gif

[Niko]

Ciao @rozalia

potresti spiegarti meglio?
non è chiaro cosa tu voglia ottenere e dove

Inoltre, si prega di non aprire lo stesso topic di supporto in più forum di assistenza. Ti stanno già supportando loro, non ha senso aprire multipli topic.
https://ajuda.forumeiros.com/t117446-codigo-da-apresentacao-de-slides#830302

[rozalia]

Voglio un codice di presentazione come l'immagine
+

@Niko 
Sai come generare il codice per visualizzare le immagini?
Si muove a destra ea sinistra come l'immagine
https://i.postimg.cc/B6LVdfCd/froru.gif


 Niko, Ho bisogno di aiuto


  Il forum di supporto portoghese non mi ha ancora aiutato

[jessy]

quarda se funziona questo

[Niko]

@rozalia prova a seguire il consiglio di @jessy

in ogni caso, la prossima volta chiedi in un solo forum di supporto, e non in più forum - perchè altrimenti rubi tempo ed energie a più persone. Bisogna avere pazienza!

[rozalia]

Grazie mille  @Niko  @jessy
---
Voglio un slideshow multifoto, non una singola foto

Ho un codice ma non si sposta né a destra né a sinistra

Codice:

<div class="conteneur_minwidth_IE"><div class="conteneur_layout_IE"><div class="conteneur_cont7ainer_IE"><div id="wr7ap"><link rel="stylesheet" type="text/css" href="https://rawgit.com/Deve-Net/style17/master/slidercss.css">
 
  <script type="text/javascript">function show(target) {document.getElementById(target).style.display = "block";}function hide(target) {document.getElementById(target).style.display = "none";}</script><div class="slider-sh"><div class="br-cl"></div><div class="titel-slide"><strong>:::creazioni dei membri:::</strong></div><div class="br-cl"></div><div style="width: 980px;margin: 0px auto;height: 200px;overflow: hidden;"><div class="image_carousel"><div class="caroufredsel_wrapper" style="text-align: right; float: none; position: relative; inset: auto; width: 976px; height: 174px; margin: 0px; overflow: hidden;"><div id="foo1" style="text-align: left; float: none; position: absolute; top: 0px; left: 0px; margin: 0px; width: 4880px; height: 174px;">
<!--The first group -->
<!--the second group -->
<a href="Link"><img src="https://i.imgur.com/Pai7RWt.png" width="220" height="150"></a><a href="Link"><img src="https://i.imgur.com/UkEZQoq.png" width="220" height="150"></a><a href="Link"><img src="https://i.servimg.com/u/f62/19/62/66/46/o10.png" width="220" height="150"></a><a href="Link"><img src="https://i.servimg.com/u/f62/19/62/66/46/o11.png" width="220" height="150"></a><a href="Link"><img src="https://i.imgur.com/8kjsl3P.png" width="220" height="150"></a><a href="Link"><img src="https://i.imgur.com/4jPaW2P.png" width="220" height="150"></a><a href="Link"><img src="https://i.imgur.com/ksNjicT.png" width="220" height="150"></a><a href="Link"><img src="https://i.imgur.com/RxyQec8.png" width="220" height="150"></a></div></div><div class="clearfix"></div><a class="prev" id="foo1_prev" href="#" style="display: block;"><span>prev</span></a><a class="next" id="foo1_next" href="#" style="display: block;"><span>next</span></a><div class="pagin7ation" id="foo1_pag" style="display: block;"><a href="#" class="selected"><span>1</span></a><a href="#" class=""><span>2</span></a></div></div></div></div>  </div></div></div></div>

[Niko]

@rozalia un gentile collega del forum arabo mi ha condiviso questo possibile codice per te

Codice:

 <meta content="width=device-width, initial-scale=1" name="viewport" />
 <style>
    .mySlides-forumattivo {
       display: none
    }

    .slideshow-forumattivo-container {
       max-width: 1000px;
       position: relative;
       margin: auto;
    }

    .next {
       right: 0 !important;
       border-radius: 3px 0 0 3px;
    }

    .prev {
       border-radius: 20px 0px 0px 20px;
    }

    .prev,
    .next {
       background: #2196f3;
    }

    .mySlides-forumattivo.fade img {
       border: solid #fff 5px;
    }

    .fade {
       text-align: center;
       animation-name: fade;
       animation-duration: 1.5s;
    }

    .mySlides-forumattivo.fade {
       background: #494e4e;
       padding: 10px;
    }

    .numbertext {
       background: black;
       color: #f2f2f2;
       font-size: 12px;
       padding: 8px;
       position: absolute;
       border-radius: 100px;
    }

    .prev,
    .next {
       cursor: pointer;
       position: absolute;
       top: 50%;
       width: auto;
       padding: 16px;
       margin-top: -22px;
       color: white;
       font-weight: bold;
       font-size: 18px;
       transition: 0.6s ease;
       border-radius: 0 3px 3px 0;
       user-select: none;
    }

    .prev:hover,
    .next:hover {
       background-color: rgba(0, 0, 0, 0.8);
    }

    .text {
       color: #f2f2f2;
       font-size: 15px;
       padding: 8px 12px;
       position: absolute;
       bottom: 8px;
       width: 100%;
       text-align: center;
    }

    .dot {
       cursor: pointer;
       height: 15px;
       width: 15px;
       margin: 0 2px;
       background-color: #bbb;
       border-radius: 50%;
       display: inline-block;
       transition: background-color 0.6s ease;
    }

    .active-forumattivo,
    .dot:hover {
       background-color: #717171;
    }

    .fade {
       animation-name: fade;
       animation-duration: 1.5s;
    }

    @keyframes fade {
       from {
          opacity: .4
       }

       to {
          opacity: 1
       }
    }

    @media only screen and (max-width: 300px) {

       .prev,
       .next,
       .text {
          font-size: 11px
       }
    }
 </style>
 <div class="slideshow-forumattivo-container">
    <div class="mySlides-forumattivo fade">
       <div class="numbertext"> 1 </div>
       <a href="777777">
          <img style="width:30%;height:140px" src="https://2img.net/u/1511/17/19/70/avatars/1-79.jpg" />
       </a>
       <a href="777777">
          <img style="width:30%;height:140px" src="https://2img.net/u/1811/68/54/94/avatars/223793-72.gif" />
       </a>
       <a href="777777">
          <img style="width:30%;height:140px" src="https://2img.net/u/1811/68/54/94/avatars/223857-91.png" />
       </a>
       <div class="text"> Caption Text </div>
    </div>
    <div class="mySlides-forumattivo fade">
       <div class="numbertext"> 2 </div>
       <a href="777777">
          <img style="width:30%;height:140px" src="https://2img.net/u/1811/68/54/94/avatars/12652-43.jpg" />
       </a>
       <a href="777777">
          <img style="width:30%;height:140px" src="https://2img.net/u/1811/68/54/94/avatars/151904-80.jpg" />
       </a>
       <a href="777777">
          <img style="width:30%;height:140px" src="https://2img.net/i/fa/i/avatars/gallery/Divers/Divers_66.jpg" />
       </a>
       <div class="text"> Caption Two </div>
    </div>
    <div class="mySlides-forumattivo fade">
       <div class="numbertext"> 3 </div>
       <a href="777777">
          <img style="width:30%;height:140px" src="https://2img.net/u/1811/68/54/94/avatars/218670-83.jpg" />
       </a>
       <a href="777777">
          <img style="width:30%;height:140px" src="https://i.servimg.com/u/f27/20/09/44/37/271710.png" />
       </a>
       <a href="777777">
          <img style="width:30%;height:140px" src="https://2img.net/u/1811/68/54/94/avatars/34486-59.jpg" />
       </a>
       <div class="text"> Caption Three </div>
    </div>
    <a onclick="plusSlides(-1)" class="prev">❮</a>
    <a onclick="plusSlides(1)" class="next">❯</a>
 </div>
 <br />
 <div style="text-align:center">
    <span onclick="currentSlide(1)" class="dot"></span>
    <span onclick="currentSlide(2)" class="dot"></span>
    <span onclick="currentSlide(3)" class="dot"></span>
 </div>
 <script>
    let slideIndex = 1;
    showSlides(slideIndex);

    function plusSlides(n) {
       showSlides(slideIndex += n);
    }

    function currentSlide(n) {
       showSlides(slideIndex = n);
    }

    function showSlides(n) {
       let i;
       let slides = document.getElementsByClassName("mySlides-forumattivo");
       let dots = document.getElementsByClassName("dot");
       if (n > slides.length) {
          slideIndex = 1
       }
       if (n < 1) {
          slideIndex = slides.length
       }
       for (i = 0; i < slides.length; i++) {
          slides[i].style.display = "none";
       }
       for (i = 0; i < dots.length; i++) {
          dots[i].className = dots[i].className.replace(" active-forumattivo", "");
       }
       slides[slideIndex - 1].style.display = "block";
       dots[slideIndex - 1].className += " active-forumattivo";
    }
 </script>

Fai un tentativo

[rozalia]

Sei davvero un creatore straordinario

 grazie  Niko