Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • November 17, 2015 at 7:43 pm #537602
    handelsmann

    Hey guys,

    have two problems with the responsiveness of the page

    1) the header picture becomes to small and the captions stays too big
    2) using a google map for the contacts on mobile the complete screen is filled with the map and I have no chance to scroll by touch to the infomatione at the bottom.

    Attached pictures

    1) What is the best way to keep a good excerpt of the pic lets say 350 x 200 pixel up, and how can I make caption responsive or if necessary delete them?
    2) What is the best way to make the information at the bottom available for mobile? Smaller the map?

    Thanks for your support

    November 19, 2015 at 3:40 pm #539058
    Andy

    Hi handelsmann!

    Would be best for us if you separate each question into different tickets. Thank you!

    Add this code to control image height and width:

    @media only screen and (max-width: 767px) {
.avia-slideshow li img {
width: 350px;
max-width: 350px;
height: 200px;
}}

    For caption on mobile use this code:

    @media only screen and (max-width: 767px) {
.avia-caption.av-slideshow-caption.active-slide {
width: 75%;
font-size: 9px;
}}

    and adjust as needed.

    If you want to hide captions on mobile completely, use this code instead:

    @media only screen and (max-width: 767px) {
.avia-caption.av-slideshow-caption.active-slide {
display: none;
}}

    Best regards,
    Andy

    November 20, 2015 at 7:06 pm #539877
    handelsmann

    Thanks Andy. Awesome.

  • Author
    Posts
Viewing 3 posts - 1 through 3 (of 3 total)
  • The topic ‘Mobile Responsiveness Easy Slider Caption & Google Map’ is closed to new replies.