Huge Performance Improvements, CSS Units and More

Joomla Wesbite Builder Gridbox with Performance Improvements and CSS Units
Mon. - Fri. 9 am - 5 pm Ask a Question
Remember me

gallery image and description going off screen

6 years 10 months ago #1

  • Alex's Avatar
  • Alex
  • Posts: 336
When you click on a thumbnail in the gallery and the image pops up the size of the image vertically is pushing the description text off screen. I would like the image and the description to resize to fit within the users view so there is no scrolling involved. I tried adjusting the size under settings and under lightbox I do have auto resize checked and also tried adjusting the width t 30% instead of 50% but the issue is not the width of the image but the vertical size. You can view the gallery here: 192.185.2.105/~carlajfi/index.php/portfolio

I do want the main image to be able to be larger for bigger screens so I did not want to make the image small so that it would all fit on screen.... I just want it to auto adjust based on the users screen size vertically and horizontally so that nothing goes off screen if that makes sense. Loving the template. Thanks for your help --- Alex

6 years 10 months ago #2

  • Artem's Avatar
  • Artem
  • Posts: 10791
Hi,

You know, to change script of resizing it something unbelievable, it requires a serious customization
I can propose you next, place description over the image, here is a screen:


Place code to your template.css file
.modal-description {
    position: absolute;
    bottom: 0;
    background: rgba(255,255,255,0.8);
}

Thanks,
Artem

6 years 10 months ago #3

  • Alex's Avatar
  • Alex
  • Posts: 336
Thanks! I am not sure that my client would go for that option unless I can get the description to only appear on hover. They don't like the image getting covered as I showed them an option with a screened out overlay before and that was the response I got. Is that possible... to have it only appear on hover?

If not are you able to message me about how much it would cost to have you code that customization. I might be willing to pay to see that happen. I would like to use this for other clients as well so it may be worth it to me to pay for the customization because everyone will want it to load within the screen window.

Thanks!

6 years 10 months ago #4

  • Artem's Avatar
  • Artem
  • Posts: 10791
Alex wrote:
... to have it only appear on hover?

Yes, it's possible,here is a code
.modal-description {
    position: absolute;
    bottom: 0;
    background: rgba(255,255,255, .8);
    opacity: 0;
    transition: 0.6s;
}

.ba-modal-body:hover .modal-description {
    opacity: 1;
}
We can make it full width with a light animation from the bottom, or any another style for description can be done. It's not a problem. But change Image Resizing script, it's another question...

Thanks,
Artem
Powered by Kunena Forum