Simplex Teaser not working

For discussion and questions related to CMS Specific templates and stylesheets (CSS), and themes. or layout issues. This is not a place for generic "I don't know CSS issues"
Post Reply
CapereSpiritum
Forum Members
Forum Members
Posts: 223
Joined: Wed Dec 28, 2011 12:11 pm

Simplex Teaser not working

Post by CapereSpiritum »

Hi

I'm trying to get the Teaser function from the Simplex template (CMSMS1.11.3) to work in another template of my own.

For now, I've copied the styles to the css sheet and the code to the template. Changed paths etc

Nothing shows at all.
The HTML

Code: Select all

<div class="banner-image cf">{assign var='teaser' value='uploads/images/teaser/*.jpg'|glob} {foreach from=$teaser item='one'}
<div><img src="{root_url}/{$one}" alt="" width="300" height="300" /></div>
{/foreach}</div>
The CSS

Code: Select all

.banner-image {
    float:right;
    display: block;
    position: relative;
    width: 67.667%;
    overflow: hidden;
    background: [[$grey]]
}
.banner-image div {
    position: absolute;
    z-index: 0;
    width: 100%;
    min-height: 100px;
    overflow: hidden;
    display: block;
    top: 0;
    left: 0
}
.banner-image img {
    display: block;
	height: auto;
    width: 100%;
    bottom: 0;
    max-width: 100%;
}
.cf:before, 
.cf:after,
.row:before,
.row:after{ 
    content: ""; 
    display: table
}
.cf:after,
.row:after{ 
    clear: both
}
.cf,
.row { 
    *zoom: 1
}
WHat am I missing? Am I just being dim?
nalecu
New Member
New Member
Posts: 3
Joined: Mon Dec 17, 2012 4:43 am

Re: Simplex Teaser not working

Post by nalecu »

You forgot to add this before the <__body> tag in your template:

Code: Select all

{cms_jquery exclude='jquery-ui.min.js,jquery.ui.nestedSortable.js,jquery.json.min.js' append='uploads/simplex/js/functions.min.js'}
CapereSpiritum
Forum Members
Forum Members
Posts: 223
Joined: Wed Dec 28, 2011 12:11 pm

Re: Simplex Teaser not working

Post by CapereSpiritum »

Hi nalecu

Thanks for that. I discovered my mistake late yesterday.

Perhaps you can help with a related query...?

I have added two teasers to a page. Each is 250x250px and are side by side. By adding two scripts linking to two slightly different js scripts, I've got both working.

I'm trying to adjust the change speeds and to make each one a little bit different. I altered the 6000 speed to 4500 in one script and to 4000 in the other.

Both teasers change at the same rate.

Any suggestions?
nalecu
New Member
New Member
Posts: 3
Joined: Mon Dec 17, 2012 4:43 am

Re: Simplex Teaser not working

Post by nalecu »

Hello.
I'm no JS guru, but I'm guessing the setInterval variable form one script is being read by the second (names being the same & all).
That's all I can think of, JS being so low on my skills list :)
But maybe if you want to use multiple responsive slides, you should switch to more advanced ones, that allow for multiple instances. Like Flexslider or the ones mentioned at the top of the functions.js file.
Post Reply

Return to “Layout and Design (CSS & HTML)”