Jquery scripts 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"
Locked
roughdiamond
New Member
New Member
Posts: 6
Joined: Mon Oct 26, 2009 12:55 am

Jquery scripts not working

Post by roughdiamond »

Hi

I having been having trouble implementing 2 Jquery scripts in cmsms.
The scripts work fine out cmsms and after reading several cmsms forumn boards about {literal} tags and testing these, I am still unable to get the code to work. Just wanna know if I have implemented the code correctly?

01 - Jquery Slider

My header code looks like the jquery slider looks like this;
{sitename} - {title}
{metadata}
{stylesheet}






{literal}

$(document).ready(function(){
$("#slider").easySlider({
auto: true,
continuous: true
});
});

{/literal}

{literal}

$(document).ready(function() {
$('#image_rotate').innerfade({
speed: 'slow',
timeout: 4000,
type: 'sequence',
containerheight: '317px'
});
});

{/literal}

and the body code looks like this;











I also have this hover script which also doesn't seem to work, even though it works fine out side cmsms.

02 - Jquery Hover Script

My header code looks like the jquery slider looks like this;

{sitename} - {title}
{metadata}
{stylesheet}






{literal}

$(document).ready(function() {
$("#workwithus a").hover(function() {
  $("#workwithus a strong").animate({backgroundColor:'#1e979c'},800);
    }, function () {
  $("#workwithus a strong").animate({backgroundColor:'#252525'},800);
    });


$("#projects figure a").hover(function() {
  $(this).stop().animate({backgroundColor:'#efefef'},400);
    }, function () {
  $(this).stop().animate({backgroundColor:'#f8f7f7'},400);
    });

$("#posts article:last").addClass("last");


$('#projets #portfolio-list').filterable({
animationSpeed: 100,
    /*
      show: { width: 'show', opacity: 'show' },
      hide: { width: 'hide', opacity: 'hide' }
    */
    async: true,
    show: { opacity: 'show' },
    hide: { opacity: 'hide' }
    });

$("#slider").easySlider({
auto: false,
    continuous: false
    });

$(".chapeau a").click(function(){
$("#panel-container").slideToggle("slow");
return false;
    });
$(".close").click(function(){
$("#panel-container").slideToggle("slow");
return false;
    });   
    });
{/literal}
JeremyBASS

Re: Jquery scripts not working

Post by JeremyBASS »






needs to be above it's plugins... HTH cheers -J
roughdiamond
New Member
New Member
Posts: 6
Joined: Mon Oct 26, 2009 12:55 am

Re: Jquery scripts not working

Post by roughdiamond »

Hey Jeremy

Sorry, but how do you mean above it's plugin?

Could you give me a sample please.
User avatar
wpbremer
Power Poster
Power Poster
Posts: 455
Joined: Thu Nov 13, 2008 12:15 pm

Re: Jquery scripts not working

Post by wpbremer »

Hi Roughdiamond,

i think JeremyBASS means the following:

you have:

Code: Select all

<__script__ type="text/javascript" src="images/js/jquery.easySlider1.7.js" ></__script>
<__script__ type="text/javascript" src="images/js/jquery-1.3.2.min.js" ></__script>
<__script__ type="text/javascript" src="images/js/jquery.color.js" ></__script>   
<__script__ type="text/javascript" src="images/js/jquery.innerfade.js" ></__script>
and it should be:

Code: Select all

<__script__ type="text/javascript" src="images/js/jquery-1.3.2.min.js" ></__script>
<__script__ type="text/javascript" src="images/js/jquery.easySlider1.7.js" ></__script>
<__script__ type="text/javascript" src="images/js/jquery.color.js" ></__script>   
<__script__ type="text/javascript" src="images/js/jquery.innerfade.js" ></__script>
this one:

Code: Select all

<__script__ type="text/javascript" src="images/js/jquery-1.3.2.min.js" ></__script>
needs to be above this one:

Code: Select all

<__script__ type="text/javascript" src="images/js/jquery.easySlider1.7.js" ></__script>
User avatar
Dr.CSS
Moderator
Moderator
Posts: 12711
Joined: Thu Mar 09, 2006 5:32 am

Re: Jquery scripts not working

Post by Dr.CSS »

To use jQuery you need to call the jquery base first...

jquery-1.3.2.min.js or whatever version you are using...
roughdiamond
New Member
New Member
Posts: 6
Joined: Mon Oct 26, 2009 12:55 am

Re: Jquery scripts not working

Post by roughdiamond »

hmm, okay, so I swapped around the jquery, which didn't make any difference.

again, I am totally confused as to why the scripts are working in the other cms (I was testing expression engine out, but cant justify buying the product), so I re-worked the whole site in CMS Made Simple. In expression engine everything works fine, obviously the way jquery link is different from CMSMS. Its weird cause it can see the css fine (which is sitting inside the cmsms Layout > Stylesheet, but it having trouble seeing the JQuery, which is an external file. So the only thing I can think of is that the code linking the JQuery is not working. And the only major difference is the {literal} tags.
uniqu3

Re: Jquery scripts not working

Post by uniqu3 »

Hi,

i never had issues using jquery with CMSMS, are you sure all your .js files are located in "images/js/" and named correctly?
Do you have a link to your site to see whats the problem?
User avatar
Dr.CSS
Moderator
Moderator
Posts: 12711
Joined: Thu Mar 09, 2006 5:32 am

Re: Jquery scripts not working

Post by Dr.CSS »

First off CMS Made Simple is different from flat file sites, Don't put anything in the root/images folder...

Use the uploads folder, if you want images for a theme/design use a folder in uploads, uploads/themename, if JS use uploads/js etc. etc....

For image/etc. used in pages where you need to add them using the editor put all those things in uploads/images even uploads/images/newfolder will work...
Locked

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