Mobile & Desktop Image Optimization |
Mobile & Desktop Image Optimization |
SanTrapGamer |
Aug 13 2020, 09:12 AM
Post
#1
|
Group: Members Posts: 4 Joined: 13-August 20 Member No.: 27,488 |
So, I have the following coding that has two images that reference hyperlinks. My issue is that prior to these, I'm using <table> with rows of 10 images in each row. When I get to the last few images (coding attached), they don't size down proportionally like the rows previously. So, I've been manually adjusting the size to hopefully match those on the Desktop view, but the images don't size properly on mobile.
CODE <a href="https://www.metagamevgc.com/urshifu" target="_blank"><img src="https://projectpokemon.org/images/sprites-models/homeimg/poke_capture_0892_001_mf_n_00000000_f_n.png" width="128"></a><a href="https://www.metagamevgc.com/urshifu-rapid-strike" target="_blank"><img src="https://projectpokemon.org/images/sprites-models/homeimg/poke_capture_0892_000_mf_n_00000000_f_n.png" width="128"></a> |
Christian J |
Aug 13 2020, 09:40 AM
Post
#2
|
. Group: WDG Moderators Posts: 9,653 Joined: 10-August 06 Member No.: 7 |
prior to these, I'm using <table> with rows of 10 images in each row. When I get to the last few images (coding attached), they don't size down proportionally like the rows previously. Are those images part of the table, or do they come after it? We'd probably need to see the complete page including any relevant CSS and javascript. Or you could simply strip away unnecessary code until you get a minimal code example and post it here. |
SanTrapGamer |
Aug 13 2020, 09:55 AM
Post
#3
|
Group: Members Posts: 4 Joined: 13-August 20 Member No.: 27,488 |
prior to these, I'm using <table> with rows of 10 images in each row. When I get to the last few images (coding attached), they don't size down proportionally like the rows previously. Are those images part of the table, or do they come after it? We'd probably need to see the complete page including any relevant CSS and javascript. Or you could simply strip away unnecessary code until you get a minimal code example and post it here. So, the coding was originally part of a table; however, when I had them within the <table></table> they were spread out way too far. The only way I could get them to stay right next to one another was to take them outside of the table and use the coding like I provided. If you'd like to see the images in action you can check them out at https://www.metagamevgc.com/vgc-2020-ioa. |
SanTrapGamer |
Aug 13 2020, 09:56 AM
Post
#4
|
Group: Members Posts: 4 Joined: 13-August 20 Member No.: 27,488 |
prior to these, I'm using <table> with rows of 10 images in each row. When I get to the last few images (coding attached), they don't size down proportionally like the rows previously. Are those images part of the table, or do they come after it? We'd probably need to see the complete page including any relevant CSS and javascript. Or you could simply strip away unnecessary code until you get a minimal code example and post it here. Here's the <table></table> that follows just prior to the coding in the OP. CODE <table> <tbody> <tr> <td> <a href="https://www.metagamevgc.com/rockruff" target="_blank"> <img src="https://files.pokefans.net/sprites/home/small/0744-000.png"> </a> </td> <td> <a href="https://www.metagamevgc.com/lycanroc" target="_blank"> <img src="https://files.pokefans.net/sprites/home/small/0745-000.png"> </a> </td> <td> <a href="https://www.metagamevgc.com/lycanroc-midnight" target="_blank"> <img src="https://files.pokefans.net/sprites/home/small/0745-001.png"> </a> </td> <td> <a href="https://www.metagamevgc.com/lycanroc-dusk" target="_blank"> <img src="https://files.pokefans.net/sprites/home/small/0745-002.png"> </a> </td> <td> <a href="https://www.metagamevgc.com/fomantis" target="_blank"> <img src="https://files.pokefans.net/sprites/home/small/0753-000.png"> </a> </td> <td> <a href="https://www.metagamevgc.com/lurantis" target="_blank"> <img src="https://files.pokefans.net/sprites/home/small/0754-000.png"> </a> </td> <td> <a href="https://www.metagamevgc.com/comfey" target="_blank"> <img src="https://files.pokefans.net/sprites/home/small/0764-000.png"> </a> </td> <td> <a href="https://www.metagamevgc.com/sandygast" target="_blank"> <img src="https://files.pokefans.net/sprites/home/small/0769-000.png"> </a> </td> <td> <a href="https://www.metagamevgc.com/palossand" target="_blank"> <img src="https://files.pokefans.net/sprites/home/small/0770-000.png"> </a> </td> <td> <a href="https://www.metagamevgc.com/kubfu" target="_blank"> <img src="https://projectpokemon.org/images/sprites-models/homeimg/poke_capture_0891_000_mf_n_00000000_f_n.png" width="256"> </a> </td> </tr> </tbody> </table> This post has been edited by SanTrapGamer: Aug 13 2020, 10:08 AM |
Christian J |
Aug 13 2020, 12:35 PM
Post
#5
|
. Group: WDG Moderators Posts: 9,653 Joined: 10-August 06 Member No.: 7 |
If you'd like to see the images in action you can check them out at https://www.metagamevgc.com/vgc-2020-ioa. The image downsizing is probably done through the javascripts on the page, maybe it specifically targets that table. QUOTE the coding was originally part of a table; however, when I had them within the <table></table> they were spread out way too far. The only way I could get them to stay right next to one another was to take them outside of the table Maybe you can do something else to make them stay next to each other within the table. Surely there must be some documentation for these scripts? |
SanTrapGamer |
Aug 13 2020, 12:41 PM
Post
#6
|
Group: Members Posts: 4 Joined: 13-August 20 Member No.: 27,488 |
If you'd like to see the images in action you can check them out at https://www.metagamevgc.com/vgc-2020-ioa. The image downsizing is probably done through the javascripts on the page, maybe it specifically targets that table. QUOTE the coding was originally part of a table; however, when I had them within the <table></table> they were spread out way too far. The only way I could get them to stay right next to one another was to take them outside of the table Maybe you can do something else to make them stay next to each other within the table. Surely there must be some documentation for these scripts? Yeah, I've been scouring the web the last couple of days since I started this project. We go through Squarespace as our domain provider. They have very little helpful resources when it comes to the use of HTML, Javascript, CSS, etc from their website. There might be a possibility of using another method to get the images to work how I would like them to. |
pandy |
Aug 13 2020, 01:26 PM
Post
#7
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,730 Joined: 9-August 06 Member No.: 6 |
Why don't you start with finding out how the images that work are scaled down?
|
Lo-Fi Version | Time is now: 18th April 2024 - 09:44 PM |