Joomla Templates Club 406,261 posts

[moody Friend moodyJoin date: April 2017Posts: 186Downloads:45Uploads:40 Thanks: 1 Thanked: 1 times in 1 posts]

#1072733

when the screen is in middle size of 980×1280 and 768×1024, such as ipad and mini ipad screen.

1) the main menu and the canvas button are showing at the same time, (please see image 1a, 1b) how to disable the main menu in middle screen size. (ipad screens)

besides, the text in slider is also not in a stable position and size . how to fix it?
i still want ipad screen can display the text in slideshow. but i need the text to show in right prosition.

2) the header and slidershow lacks proportion when the screen size are changing. for example when i drag the the screen width shorter ,the height of slideshow became very narrow . (pls see image2) so the slider background image is not showing properly., how to fix it?

3)and when i drag the screen size with my computer, at a certain size, the header area will looks like having two tones of blue.( probably the slide-show background image top margin is not adjusted properly?- pls see image 3) how to fix it?

4:the header moves up, when i click the canvas button. (pls see image4) how to make the header stay at the same level of height , not moving up-forward .

• This topic was modified 7 years ago by  moody.

---

Attachments:

1. 
2. 
3. 
4. 
5. 

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#1073111

Hi,

For that off-canvas menu button, you can change breakpoints in LESS file, in which you can decide in which screen size, the button will appear.

Could you share the FTP account also so I will take a look? and pls backup your site first, I may need to compile less to css.

[moody Friend moodyJoin date: April 2017Posts: 186Downloads:45Uploads:40 Thanks: 1 Thanked: 1 times in 1 posts]

#1073386

This reply has been marked as private.

[moody Friend moodyJoin date: April 2017Posts: 186Downloads:45Uploads:40 Thanks: 1 Thanked: 1 times in 1 posts]

#1073896

This reply has been marked as private.

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#1074268

This reply has been marked as private.

[moody Friend moodyJoin date: April 2017Posts: 186Downloads:45Uploads:40 Thanks: 1 Thanked: 1 times in 1 posts]

#1074341

This reply has been marked as private.

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#1074555

Hi,

I update the breadpoint to:

// Point at which the navbar stops collapsing
@grid-float-breakpoint:     @screen-md-min;

and the menu is not showing now on medium screen.

Please check the responsive in real devices, sometime resizing browsers doesn’t bring out the correct result.

[moody Friend moodyJoin date: April 2017Posts: 186Downloads:45Uploads:40 Thanks: 1 Thanked: 1 times in 1 posts]

#1075081

This reply has been marked as private.

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#1075296

Hi,

It looks good at my end now (attached screenshot), did you get it solved?

For the off-canvas button, kindly check our demo site here, it’s not aligned with the login link.

[moody Friend moodyJoin date: April 2017Posts: 186Downloads:45Uploads:40 Thanks: 1 Thanked: 1 times in 1 posts]

#1075355

This reply has been marked as private.

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#1075603

It due to your custom in ‘custom.css’ file. I update the css rule:

.block-slideshow-item .block-bg {
        background-size: 100%!important;

to: background-size: cover

and it’s showing fine now. Kindly check.

[moody Friend moodyJoin date: April 2017Posts: 186Downloads:45Uploads:40 Thanks: 1 Thanked: 1 times in 1 posts]

#1075972

This reply has been marked as private.

[moody Friend moodyJoin date: April 2017Posts: 186Downloads:45Uploads:40 Thanks: 1 Thanked: 1 times in 1 posts]

#1075973

besidea, the slidershow image is not showing full width when it is on mini ipad screen. how to fix it?

• This reply was modified 7 years ago by  moody.

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#1076218

I updated the main menu and off-canvas icon for you.

For the font size of block title in slideshow, you can open the file:

Look for this declaration: /templates/ja_hotel/acm/slideshow/less/style.less

.block-title {
  font-size: @font-size-h1;

  // Control screen tablet / mobile
  @media screen and (max-width: @screen-sm-max) {
    font-size: @font-size-h3;
    margin-bottom: 0;
    //padding: (@line-height-computed * 2) 0;
  }
}

at this moment, it’s set with font-size-h3 (around 24px), you can change to your desired value.

[moody Friend moodyJoin date: April 2017Posts: 186Downloads:45Uploads:40 Thanks: 1 Thanked: 1 times in 1 posts]

#1076240

Hi saguaros thanks for that

.
Is it possible to make the slider background image to be shown in full width on iPad/iPad mini screens?

[Author]

Posts