• Post Reply Bookmark Topic Watch Topic
  • New Topic
programming forums Java Mobile Certification Databases Caching Books Engineering Micro Controllers OS Languages Paradigms IDEs Build Tools Frameworks Application Servers Open Source This Site Careers Other all forums
this forum made possible by our volunteer staff, including ...
Marshals:
  • Campbell Ritchie
  • Bear Bibeault
  • Ron McLeod
  • Jeanne Boyarsky
  • Paul Clapham
Sheriffs:
  • Tim Cooke
  • Liutauras Vilda
  • Junilu Lacar
Saloon Keepers:
  • Tim Moores
  • Stephan van Hulst
  • Tim Holloway
  • fred rosenberger
  • salvin francis
Bartenders:
  • Piet Souris
  • Frits Walraven
  • Carey Brown

How do I define different sizes of a modal image within one webpage?

 
Greenhorn
Posts: 9
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I found code at w3schools for opening thumbnails into full-sized modal images that works really well, except that some of the images are very wide panoramas, and the definition I am using for the modal (60% width) does not work well for these wider images, which are very short as a result.  The other images fill the screen vertically at 60% width, but not the panoramas.  How can I create a different definition for the panoramas?  I wanted to post my code but I don't understand the directions for doing so and I am afraid of doing it incorrectly.  I think my question is virtually meaningless without the code.  Thanks for any directions you can provide.  Is there a video tutorial anywhere on how to post your code to this site?

 
Bartender
Posts: 7202
65
Eclipse IDE Firefox Browser MySQL Database VI Editor Java Windows
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
To post your code just cut-n-paste the code. Then drag the cursor over the code so that it is highlighted. Then click on the 'Code' button just above the edit window. To see if it worked click on the 'Preview' button below the edit window. The code should appear in the preview window with line numbers.
 
Barton Lewis
Greenhorn
Posts: 9
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Thank you.  Here it is.  It's mich longer than the 20 lines of code you recommend in the FAQ, but I stripped out everything that I thought was not essential to the problem and left what I thought was in.  This is my first post.  Trial by error.

 
Carey Brown
Bartender
Posts: 7202
65
Eclipse IDE Firefox Browser MySQL Database VI Editor Java Windows
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
I'm afraid you've posted on a "Java" forum. What you posted is  "JavaScript", not "Java" (aside from the annoying name similarities).
 
Barton Lewis
Greenhorn
Posts: 9
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Of course, silly me, not paying close attention.  Thank you.  I will repost to the correct forum.
 
Barton Lewis
Greenhorn
Posts: 9
  • Mark post as helpful
  • send pies
  • Quote
  • Report post to moderator
Thank you.  I see that the version of the page I posted uses a height: 70% as opposed to width: 60% definition, as referenced in my post.  Sorry for the error/confusion.  But the problem is the same:  the panorama spills over the edges of the screen while displaying correctly for the other 2 images.  So I need something like height: 50% for the panorama - just not sure how to write the code to get 2 different classes of images.
 
Can you shoot lasers out of your eyes? Don't look at this tiny ad:
Thread Boost feature
https://coderanch.com/t/674455/Thread-Boost-feature
    Bookmark Topic Watch Topic
  • New Topic