Joomla Templates Club 406,261 posts

[conforturis Friend conforturisJoin date: April 2010Posts: 256Downloads:0Uploads:58 Thanks: 59 Thanked: 7 times in 1 posts]

#198478

Hi,
How can add mask in JA Slideshow module on my site with JA Univercity T3
like you have in JA Droid template with JA Framework?

I want add this mask in JA Univercity T3 template

---

Attachments:

1. 

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#537786

That effect is created using an image “mask” effect.

The CSS relative to this effect in JA Droid is as follows:


#ja-slideshow .ja-slide-mask2 {
background: url("../templates/ja_droid/images/sl-mask-right.png") no-repeat scroll right bottom rgba(0, 0, 0, 0);
position: absolute;
z-index: 101;
}

This is combined with a general black background for the slideshow position, as follows:


#ja-slideshow {
background: none repeat scroll 0 0 #000000
border-top: 1px solid #000000
overflow: hidden;
position: relative;
z-index: 10;
}

What I would suggest you do is download the quickstart files for JA Droid, and then inspect the relative CSS and image files to try to duplicate the effect for your JA University based slideshow. It will likely take some trial-and-error – and patience – but I’m certain it can be accomplished.

[conforturis Friend conforturisJoin date: April 2010Posts: 256Downloads:0Uploads:58 Thanks: 59 Thanked: 7 times in 1 posts]

#537916

I uploaded the images into
/templates/ja_university_t3/images/sl-mask-right.png
and
/templates/ja_university_t3/images/sl-mask-left.png

then I inserted code

#ja-slideshow .ja-slide-mask2 {
background: url("../templates/ja_droid/images/sl-mask-right.png") no-repeat scroll right bottom rgba(0, 0, 0, 0);
position: absolute;
z-index: 101;
}

#ja-slideshow {
background: none repeat scroll 0 0 #000000
border-top: 1px solid #000000
overflow: hidden;
position: relative;
z-index: 10;
}
into templates/ja_university_t3/css/mod_jaslideshow.css

but is not working :((

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#537917

You need to make sure that the CSS rules/classes/syntaz match those for the JA University template.

It may (or may not) be slightly different than that of/for JA Droid

[conforturis Friend conforturisJoin date: April 2010Posts: 256Downloads:0Uploads:58 Thanks: 59 Thanked: 7 times in 1 posts]

#537924

I can not do that. Can you help me?

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#537926

<em>@conforturis 430902 wrote:</em><blockquote>I can not do that. Can you help me?</blockquote>

It would be most helpful if you could provide the url of the site you’re working on

[conforturis Friend conforturisJoin date: April 2010Posts: 256Downloads:0Uploads:58 Thanks: 59 Thanked: 7 times in 1 posts]

#537928

I sent in a private message

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#538726

<em>@conforturis 430907 wrote:</em><blockquote>I sent in a private message</blockquote>
@conforturis: Thanks for contacting me, I have checked your site I appreciate the hard work on your site. But you can try to do steps below

+ Download and install JA Slideshow module on your site from: http://www.joomlart.com/forums/downloads.php?do=cat&id=20348

+ Config JA Slideshow module with Droid profile by you can install JA Droid template from builder.joomlart.com and compare the same the configuration

+ Download and extract my attached files

+ Copy mod_jaslideshow folder into templates/ja_university_t3/html folder

+ Copy custom.css file into templates/ja_university_t3/css folder

+ Copy sl-mask-left.png and sl-mask-right.png files into templates/ja_university_t3/images folder

---

Attachments:

1. custom.zip

[conforturis Friend conforturisJoin date: April 2010Posts: 256Downloads:0Uploads:58 Thanks: 59 Thanked: 7 times in 1 posts]

#538741

The images are not aligned to the center
they are aligned left within the slideshow.
You can see it on a larger screen than 1200 wide, or decreasing the width of the image in the slideshow module settings.
I tried searching with the inspector element tool in google chrome but could not find.

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#538742

So that I can take a look and try to assist, please pm me URL of your site, admin login, FTP account of your site. I will help you check further

[conforturis Friend conforturisJoin date: April 2010Posts: 256Downloads:0Uploads:58 Thanks: 59 Thanked: 7 times in 1 posts]

#538748

I sent in a private message

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#538751

<em>@conforturis 432010 wrote:</em><blockquote>I sent in a private message</blockquote>

It is solved. Here is my workaround to do this

Open templates/ja_university_t3/css/mod_jaslideshow.css file, find and remove line 59

.ja-slide-main-wrap {
width:100% !important;
}

[conforturis Friend conforturisJoin date: April 2010Posts: 256Downloads:0Uploads:58 Thanks: 59 Thanked: 7 times in 1 posts]

#539037

I cannot see resizing images in slideshow in small screens.
If you see demo you will see image in slideshow resizing in small screen tabblet and moblie.
http://www.joomlart.com/demo/#ja_university

Demo are using module JA Slideshow Lite.
Why I am not using module JA Slideshow Lite? I wand show only one image (not in slide) and random every time refresh window.
I installed the module JA Slideshow because module JA Slideshow Lite can not show images in random if I set Autoplay for Not.

---

Attachments:

1. 

[Ninja Lead Moderator Ninja LeadJoin date: November 2014Posts: 16064Downloads:310Uploads:2864 Thanks: 341 Thanked: 3854 times in 3563 posts]

#539213

<blockquote>I cannot see resizing images in slideshow in small screens.
If you see demo you will see image in slideshow resizing in small screen tabblet and moblie.</blockquote>

As JA Slideshow module is not supported by default in JA University template, thus no css style for small screens.

<blockquote>Demo are using module JA Slideshow Lite.
Why I am not using module JA Slideshow Lite? I wand show only one image (not in slide) and random every time refresh window.
I installed the module JA Slideshow because module JA Slideshow Lite can not show images in random if I set Autoplay for Not.</blockquote>

I have set JA Slideshow module to show random images on your site. Please check again.

[conforturis Friend conforturisJoin date: April 2010Posts: 256Downloads:0Uploads:58 Thanks: 59 Thanked: 7 times in 1 posts]

#539228

Do you enabled the Autoplay feature on my site?
I do not want this feature enabled because I want to show only one image (not slide).
Maybe you did not notice my question. I want to show the slideshow module on small screen (tablet and mobile) but it does resize of images according to the size of the screen. This is the question

[Author]

Posts