Home Entrance Wiki Search Login Register

Welcome, Guest. Please login or register. - Thinking of joining the forum??
April 14, 2024 - @731.92 (what is this?)
Forum activity rating: Four Star Posts: 57/1k.beats Unread Topics | Unread Replies | Own Posts | Own Topics | Random Topic | Recent Posts
News: :ha: :pc: Hello Melonland! :pc: :happy:

+  MelonLand Forum
|-+  World Wild Web
| |-+  ✁ ∙ Web Crafting
| | |-+  Making a gallery


« previous next »
Pages: [1] Print
Author Topic: Making a gallery  (Read 618 times)
SilkSkull
Hero Member ⚓︎
*****


SpaceHey: Friend Me!
iMood: SilkSkull
Matrix: Chat!

View Profile WWW

First 1000 Members!MARIO64.PNGCool Dude AwardJoined 2022!High Speed Ozwomp!
« on: February 07, 2023 @23.91 »

I'm making a gallery on my site and was wondering what would be a good way to display images? I was thinking an Iframe (if anyone has a resource to learn about those it would be appreciated) but I wanted to ask on here and see if there was a better/easier way? I just assumed Iframe because it would cut down on the length of the page and you wouldn't have to scroll all the way down to see the footer.
Logged

She/Her
"Will you stop adding lampposts to my games?"

Melooon
Hero Member ⚓︎
*****


So many stars!

SpaceHey: Friend Me!
StatusCafe: melon
iMood: Melonking
Itch.io: My Games

View Profile WWW

First 1000 Members!spring 2023!Squirtle!!!!MIDI WarriorMIDI Warrior1234 Posts!OzspeckCool Dude AwardRising Star of the Web AwardMessage BuddyPocket Icelogist!OG! Joined 2021!The Smallest Ozwomp Known To ManBug!
« Reply #1 on: February 07, 2023 @63.72 »

Hmmmm; there are lots of ways of doing galleries and I think there is no right or wrong way! It depends on what kind of images you wanna show, how many images you wanna have and who your audience is!

Do you have 10 or 100 images? Are they artworks, or photography? Do you want people to look at all of them, or just find a few? Do you just wanna show pictures seriously, or do you want it to be more fun and have picture frames and stuff?

iFrames can be good - its cool when you can focus on each picture without being overwhelmed, but it can also be a little claustrophobic and can make it hard to see all the pictures.

Im lazy and usually just dump everything in a list on a page and call it a day :tongue: but you can do better!
Hmmm I really need to do my frames tutorial :drat:
Logged


everything lost will be recovered, when you drift into the arms of the undiscovered
RodFireProductions
Jr. Member ⚓︎
**


🍄🖤🐀

StatusCafe: rodfire8181
iMood: rodfire8181
Itch.io: My Games

View Profile WWW

First 1000 Members!Joined 2022!
« Reply #2 on: February 07, 2023 @84.33 »

It really depends on the look and functionality you're going for. I made a gallery for my art awhile ago using baguetteBox.js. You can use small thumbnails to not take up space. Clicking on the thumbnails brings up a modal to show the full image. This does require Javascript.



Im lazy and usually just dump everything in a list on a page and call it a day :tongue: but you can do better!
An alternative to this list method is just dumping it all into a simple grid that auto-adjusts itself to screens. It's the same type of way all the thumbnails in my gallery rest.
Code
.gallery {
  display: grid;
  grid-gap: 1em;
  grid-template-columns: repeat( auto-fill, minmax(250px, 1fr) );
  grid-template-rows: auto;
}

Logged

we art, web dev, and game dev
nymphaeaphoo
Casual Poster ⚓︎
*



View Profile WWW

First 1000 Members!Joined 2022!High Speed Ozwomp!
« Reply #3 on: February 07, 2023 @528.90 »

My stubbornness to use JavaScript had lead me to create https://lophius.xyz/gallery, which uses the css target selector to pick out a single artwork the user wants to look at more closely and uses a similar technique to select from multiple variations of each image which is a pretty niche use case.

Logged

-
tarraxahum
Full Member ⚓︎
***


Xx_O_o_xX

SpaceHey: Friend Me!
StatusCafe: tarraxahum
iMood: tarraxahum
Matrix: Chat!

View Profile WWW

First 1000 Members!Joined 2022!
« Reply #4 on: February 07, 2023 @754.70 »

I had a very particular view of how I wanted my gallery to look, so eventually after a lot of digging I found a good enough script on stockoverflow and adjusted it a bit for my needs. What it gets me are clickable thumbnails and a full image opening up on click, with a description underneath if I put one there, and that's more or less what I wanted to have. So that's one way to do it, I suppose!

Examples of use would go as such and such (since I have two galleries, one for the comic and one for everything else).

Here it is as I use it.
« Last Edit: June 14, 2023 @623.61 by tarraxahum » Logged



"Why change the past, when you can own this day?" (c)
Cele
Sr. Member
****

any way the wind blows


View Profile

First 1000 Members!Joined 2022!
« Reply #5 on: February 08, 2023 @351.16 »

OK if I understood correctly...

You can make a scroll box without needing an iframe.

Code
<div style="height:250px;width:600px;border:0px solid #ccc;overflow:auto;">
All the images here
</div>


Of course change the height and width to fit your site. You get a box of a certain size on the page which can be scrolled without needing an iframe, so people don't have to scroll all the way down on the page to see the footer.
Logged
SilkSkull
Hero Member ⚓︎
*****


SpaceHey: Friend Me!
iMood: SilkSkull
Matrix: Chat!

View Profile WWW

First 1000 Members!MARIO64.PNGCool Dude AwardJoined 2022!High Speed Ozwomp!
« Reply #6 on: February 08, 2023 @978.34 »

The page is up! I'll definitely be considering some of these methods for an update later on but I just wanted to get something out instead of trying to perfect it.
Logged

She/Her
"Will you stop adding lampposts to my games?"

Pages: [1] Print 
« previous next »
 

Vaguely similar topics! (3)

[Transit Pass Gallery] 🚂

Started by NightdriftBoard ☺︎ ∙ General Interests

Replies: 8
Views: 2277
Last post October 13, 2022 @888.02
by SilkSkull
I am new to making sites and I want some tips to improve.

Started by Icey!Board ☔︎ ∙ I need Help!

Replies: 4
Views: 1741
Last post December 14, 2021 @853.48
by Icey!
php heck: making a search engine

Started by cinniBoard ☔︎ ∙ I need Help!

Replies: 2
Views: 1455
Last post February 22, 2022 @256.30
by ellievoyyd

Melonking.Net © Always and ever was! SMF 2.0.19 | SMF © 2021, Simple Machines | Terms and Policies Forum Guide | Rules | RSS | WAP2


MelonLand Badges and Other Melon Sites!

MelonLand Project! Visit the MelonLand Forum! Support the Forum
Visit Melonking.Net! Visit the Gif Gallery! Pixel Sea TamaNOTchi