HTML & CSS Need to build a slideshow display for showcasing partners, how do I go about doing this?

[Malcolm]

Hi Coders,

I'm looking to build a widget for our sidebar to display our partners in a cleaner way. I started playing around with HTML & CSS while following along to a tutorial on slide shows by W3School, I noticed that it requires JavaScript, do I really need JavaScript in building a slideshow? I'm not really familiar with it and was hoping I use some sort of HTML element to help work around this.

 

[Ash]

I haven't touched Javascript just yet but I think it's one of the next topics at uni for our web development module. I don't want to 100% confirm this but I'm pretty sure Javascript will be needed if you want them to move and act like a gallery/slideshow. If it's just images next to each other (like 2x2 layout) then you could do it with just HTML and CSS.

 

[Tealk]

Something like this?

How To Create a Slideshow

W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.

www.w3schools.com

 

[Malcolm]

I haven't touched Javascript just yet but I think it's one of the next topics at uni for our web development module. I don't want to 100% confirm this but I'm pretty sure Javascript will be needed if you want them to move and act like a gallery/slideshow. If it's just images next to each other (like 2x2 layout) then you could do it with just HTML and CSS.

Thanks, Ash! That’s what I presumed, but thought I’d try finding an alternative. Thank you!

Something like this?

How To Create a Slideshow

W3Schools offers free online tutorials, references and exercises in all the major languages of the web. Covering popular subjects like HTML, CSS, JavaScript, Python, SQL, Java, and many, many more.

www.w3schools.com

Yep, exactly the one I was following!

 

[Deleted member 205]

Yeah, probably.

If you want it to move then yeah, definitely. I was going to say that if you just wanted it to move using just CSS when the user hovers over it then you could've used CSS's transition function: :hover where once the user hovers over the image, it switches to the next one. But, then unless CSS has a feature where it transitions to a completely different image/text then looks like JS is your only option. None of this is exactly achievable with HTML or CSS only.

 

[Tealk]

Yep, exactly the one I was following!

that would be very easy to insert as a sidebox or something like that.

 

[Malcolm]

I guess my worry with the tutorial I simply don’t want to copy and paste the code, you get what I mean? I want to actually build it myself, is this the right mentally that I should have?

 

[Tealk]

I simply don’t want to copy and paste the code

That I do not understand, why reinvent the wheel?

Copy code, adapt it the way you want and use it.
That's what code is published for.

 

[Ash]

There are loads of example codes online that can be used for the sidebar. Copy it, modify it and use it, as @Tealk mentioned. By modifying and playing around with it, you make it unique and you will end up learning about the code itself as well.

 

[Malcolm]

Alright I will thank you guys!