TheRealso0sick
01-02-2012, 05:59 PM
Hi!
I'm trying to implement a jquery plugin
to one of my CMPS Modules.
I've added the HTML code to a BB code Module (very simple code),
the CSS to my main CSS/additional CSS
and added/linked the Jquery/Plugin in my headinclude template.
Though, the Jquery script does not seem to have any effect
on my html code and i can't figure out why.
Is anyone experienced with this and can tell me what i'm doing wrong?
When testing the exact same code on a external page, it worked perfectly fine.
Heres my code:
(The sources are correct btw)
Jquery/JS (in headinclude template)
<script src="http://code.jquery.com/jquery-1.7.1.js"></script>
<script src="jquery.kwicks-1.5.1.js"></script>
<script>
$().ready(function() {
$('.kwicks').kwicks({
max : 205,
spacing : 5
});
});
</script>HTML (in CMPS BB code module)
<ul class="kwicks" >
<li id="kwick1">1</li>
<li id="kwick2">2</li>
<li id="kwick3">3</li>
<li id="kwick4">4</li>
</ul> CSS (in main/additional CSS)
.kwicks {
list-style: none;
position: relative;
margin: 0;
padding: 0;
}
.kwicks li{
display: block;
overflow: hidden;
padding: 0;
cursor: pointer;
}
.kwicks li{
float: left;
width: 125px;
height: 350px;
margin-right: 5px;
}
#kwick1 {
background-color: #53b388;
background-image: url('../images/meet.gif');
}
#kwick2 {
background-color: #5a69a9;
background-image: url('../images/kwicks.gif');
}
#kwick3 {
background-color: #c26468;
background-image: url('../images/for.gif');
}
#kwick4 {
background-color: #bf7cc7;
background-image: url('../images/jquery.gif');
margin-right: none;
}
Any help is greatly appreciated!
I'm trying to implement a jquery plugin
to one of my CMPS Modules.
I've added the HTML code to a BB code Module (very simple code),
the CSS to my main CSS/additional CSS
and added/linked the Jquery/Plugin in my headinclude template.
Though, the Jquery script does not seem to have any effect
on my html code and i can't figure out why.
Is anyone experienced with this and can tell me what i'm doing wrong?
When testing the exact same code on a external page, it worked perfectly fine.
Heres my code:
(The sources are correct btw)
Jquery/JS (in headinclude template)
<script src="http://code.jquery.com/jquery-1.7.1.js"></script>
<script src="jquery.kwicks-1.5.1.js"></script>
<script>
$().ready(function() {
$('.kwicks').kwicks({
max : 205,
spacing : 5
});
});
</script>HTML (in CMPS BB code module)
<ul class="kwicks" >
<li id="kwick1">1</li>
<li id="kwick2">2</li>
<li id="kwick3">3</li>
<li id="kwick4">4</li>
</ul> CSS (in main/additional CSS)
.kwicks {
list-style: none;
position: relative;
margin: 0;
padding: 0;
}
.kwicks li{
display: block;
overflow: hidden;
padding: 0;
cursor: pointer;
}
.kwicks li{
float: left;
width: 125px;
height: 350px;
margin-right: 5px;
}
#kwick1 {
background-color: #53b388;
background-image: url('../images/meet.gif');
}
#kwick2 {
background-color: #5a69a9;
background-image: url('../images/kwicks.gif');
}
#kwick3 {
background-color: #c26468;
background-image: url('../images/for.gif');
}
#kwick4 {
background-color: #bf7cc7;
background-image: url('../images/jquery.gif');
margin-right: none;
}
Any help is greatly appreciated!