Joomla Templates Club 406,261 posts

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

#977427

Hi,

There is same topic here: https://www.joomlart.com/forums/topic/slideshow-on-mobile-or-one-image-in-the-same-position-as-slideshow-on-mobile/

[anvar.zackaria Friend anvar.zackariaJoin date: October 2016Posts: 5Downloads:20Uploads:1]

#977430

I don’t find any reply in the above thread. Only questions by the same person. He says ‘I find answer’, but I don’t find any answer. Please help. Thanks.

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

#977454

I quote it here:
/ Slideshow /
.ja-slideshow .container {
padding: 0;
width: auto;
}
.ja-ss-btns .ja-ss-prev {
background-position: 0 0;
left: 20px !important;
}
.ja-ss-btns .ja-ss-next {
background-position: right 0;
right: 20px !important;
}
.ja-slideshow {
background: none !important;
} @media screen and (max-width: 1350px) {
.ja-slideshow .container {
padding-left: 0px !important;
padding-right: 0px !important;
}
}
@media (max-width: 767px) {
.hidden-xs {
display: inline-block !important;
}
} @media (min-width: 768px) and (max-width: 938px) {
.hidden-sm {
display: inline-block !important;
}
} @media (min-width: 939px) and (max-width: 1279px) {
.hidden-md {
display: inline-block !important;
}
}

.ja-ss-item {
display: block;
float: left;
margin: 0;
overflow: hidden;
position: absolute;
right: 0;
left: 0;
width: 100%;
min-height: 0px !important;
z-index: 1;
backface-visibility: hidden;
-moz-backface-visibility: hidden;
-webkit-backface-visibility: hidden;
}

[anvar.zackaria Friend anvar.zackariaJoin date: October 2016Posts: 5Downloads:20Uploads:1]

#977470

Thanks for that. I did see that code and compared it with the existing code and I’m not sure what change has to be made and in which css file to make the slide show appear in the mobile phone.

Thanks

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

#977481

I guess he put into the file: ROOT/templates/ja_your_default_template/css/custom.css (create this file if it doesn’t exist).

[anvar.zackaria Friend anvar.zackariaJoin date: October 2016Posts: 5Downloads:20Uploads:1]

#977520

Thanks. I copied that content in the following file: mod_jaslideshowlite-custom.css

This is what happens after the change:

• The slide show does appear in the mobile phone, however without the background color
• In the computer browser the slide show is distorted with: no background color and the images positions are disturbed.

Unless there is tested code available for this, I don’t think I can use that code as it may distort the existing slide show setup.

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

#977931

Hi,

I updated into your site via file: ROOT/templates/ja_nuevo/tpls/blocks/slideshow.php

Change: <div class="wrap ja-slideshow <?php $this->_c('slideshow') ?>">

To: <div class="wrap ja-slideshow">

You can see it displays in mobile view now.

[anvar.zackaria Friend anvar.zackariaJoin date: October 2016Posts: 5Downloads:20Uploads:1]

#977938

Thanks for that. Yes it displays now. However I find a new problem. The icons in the circle image of ‘Our Services’ has gone missing. Not sure if it’s related to the change. Please see screenshot.

---

Attachments:

1. 

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

#977944

It should not because it belongs to different module.

I also checked in backend of your site and see that modules in this part don’t have icons. For example, I edited module ID:105 – Software Consulting

Previously, it had: <div class="circle-icon background-1"> </div>

While it should be: <div class="circle-icon background-1"><i class="fa fa-desktop"></i></div>

You can check the same for other modules, pls note that when editing Joomla content / content in custom HTML modules like this, you should turn off the editor via Global Configuration because the editor often strips out some HTML tags and cause issue.

[anvar.zackaria Friend anvar.zackariaJoin date: October 2016Posts: 5Downloads:20Uploads:1]

#977948

Great thanks! Yes, I turned on the editor and that cause the problem. It’s fixed now.
Appreciate your wonderful support!

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

#977950

You’re welcome!

Have a nice day!!!

[Author]

Posts