HTML5/CSS carrousel met linkje

[theorganiser]

Hi allemaal,
ik ben bezig met een website te maken in HTML5

nu heb ik een Carrousel hierin zitten en dit werkt goed.
ik wil echter dat de plaatjes in de carrousel clickable zijn naar een andere link.
ik heb nu de volgende code :

echter onderin gaat goed( oude situatie)
bovenin worden de plaatjes echter helemaal uitgerekt en verknipt aan de container waar het instaat

code:

[b]<div class="cycle-slideshow" 
    data-cycle-fx=carousel
    data-cycle-timeout=3000
    data-cycle-carousel-visible=1
    data-cycle-carousel-fluid=true
    data-cycle-slides="> a"
    >
     <a href="https://malsup.github.io/images/p1.jpg">
    <img src="images/carrousel/carrousel1.jpg">
    </a>
    <a href="https://malsup.github.io/images/p2.jpg">
    <img src="images/carrousel/carrousel2.jpg">
    </a>
</div>[/b]
        
<div class="cycle-slideshow" 
    data-cycle-fx=carousel
    data-cycle-timeout=3000
    data-cycle-carousel-visible=1
    data-cycle-carousel-fluid=true
    >
    <img src="images/carrousel/carrousel1.jpg">
    <img src="images/carrousel/carrousel2.jpg">
    <img src="images/carrousel/carrousel3.jpg">
    <img src="images/carrousel/carrousel4.jpg">
                        
</div>

wie ziet er wat er fout gaat en kan een tweaker die helemaal gek geworden is helpen

[ Voor 3% gewijzigd door theorganiser op 06-01-2022 16:05 ]

[AW_Bos]

Kom eens met een testcase aan via JSfiddle?
Dan kunnen we er makkelijker naar kijken. We hebben niet zelf een ingebouwde render-tool in ons hoofd

[flashzorrr]

Wellicht moeten je images directe children zijn van de container - dus mag je er geen <a> tag omheen zetten?

[W99]

Ik denk dat er geen a tag omheen mag. Dan zou je met een onclick om gebruikers te gaan doorlinken.

Linkje naar voorbeeld: https://www.w3docs.com/sn...hat-acts-like-a-link.html

[DJMaze]

Je probleem is het gebruik van JavaScript.
Dat heb je niet gemeld.

Doe het eens zonder JavaScript zoals je hier kan vinden:
https://css-tricks.com/css-only-carousel/

[theorganiser]

DJMaze schreef op donderdag 6 januari 2022 @ 18:58:
Je probleem is het gebruik van JavaScript.
Dat heb je niet gemeld.

Doe het eens zonder JavaScript zoals je hier kan vinden:
https://css-tricks.com/css-only-carousel/

excues, ik heb gebruik gemaakt van Cycle2 , dit is inderdaad een javascript.
aangezien ik hem reponsive wil bouwen is dit volgens mij wel nodig?
https://jquery.malsup.com/cycle2/demo/carousel.php

ik heb nu de onclick methode gebruikt en dit lijkt te werken!

[ Voor 12% gewijzigd door theorganiser op 07-01-2022 23:20 ]

[Reinier]

W99 schreef op donderdag 6 januari 2022 @ 17:18:
Ik denk dat er geen a tag omheen mag. Dan zou je met een onclick om gebruikers te gaan doorlinken.

Linkje naar voorbeeld: https://www.w3docs.com/sn...hat-acts-like-a-link.html

Ik kots op websites met zulke linkjes. Ik open altijd een miljard tabs d.m.v. middelste muisknop en dat gaat kapot bij onclick links.