Tweet
Bonjour,
Après plusieurs recherches sur le net sans succès, j’ai décidé finalement de poster mon problème sur le forum, afin de trouver si possible une solution à mon problème.
J’ai pu mettre en place un ken burns effect qui fonctionne très bien. Code ci-dessous (A).
Mon problème, est le suivant :
Je n’arrive pas à faire fonctionner mon programme quand je l’intègre à mon site joomla. Je pense que le problème provient du faite que mon fichier n’arrive pas à lire la fonction crossSlide du fichier jquery.cross-slide.js.
Code (B), montre la manière dans j’ai inséré mon code dans l’index du site.
Quelqu'un pourra m’aider SVP ?
Dans l’attente, je vous souhaite une très belle soirée.
Cordialement,
Code (A):
<style type="text/css">
#crossslide{
width: 516px;
height: 152px;
position:relative;
border: none;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.js" type="text/javascript"></script>
<script src="jquery.cross-slide.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#crossslide').crossSlide({
fade: 8
}, [
{
src: 'AboutUs.jpg',
from: '50% 0% 5.9x',
to: '100% 80% 1x',
time: 6
}, {
src: 'technology.jpg',
href: 'http://www.w3c.org/',
from: '0% 100% 5.7x',
to: '100% 0% 1x',
time: 6
}, {
src: 'press.jpg',
href: 'http://www.php.net/',
from: '50% 0% 5.9x',
to: '100% 80% 1x',
time: 6
}, {
src: 'technology.jpg',
href: 'http://www.php.net/',
from: '100% 80% 1.9x',
to: '50% 0% 5.7x',
time: 6
}, {
src: 'support.jpg',
href: 'http://www.php.net/',
from: '50% 0% 5.9x',
to: '100% 80% 1x',
time: 6
}
]);
});
</script>
<div id="crossslide">Loading...</div>
Code (B)
<head>
<script type="text/javascript" src="<?php echo $this->baseurl ?>/templates/beez_20/javascript/jquery.js"></script>
<script type="text/javascript" src="<?php echo $this->baseurl ?>/templates/beez_20/javascript/jquery.cross-slide.js"></script>
<script>
$(document).ready(function(){
$("#crossslide").crossSlide({
fade: 1
}, [
{
src: 'promotions/agadir/atlas-agadir.jpg',
from: '50% 0% 5.9x',
to: '100% 80% 1x',
time: 6
}, {
src: 'promotions/agadir/founty-agadir.jpg',
href: 'http://www.w3c.org/',
from: '0% 100% 5.7x',
to: '100% 0% 1x',
time: 6
}, {
src: 'promotions/agadir/founty-agadir.jpg',
href: 'http://www.php.net/',
from: '50% 0% 5.9x',
to: '100% 80% 1x',
time: 6
}, {
src: 'promotions/agadir/atlas-agadir.jpg',
href: 'http://www.php.net/',
from: '100% 80% 1.9x',
to: '50% 0% 5.7x',
time: 6
}, {
src: 'promotions/agadir/founty-agadir.jpg',
href: 'http://www.php.net/',
from: '50% 0% 5.9x',
to: '100% 80% 1x',
time: 6
}
]);
});
</script>
</head>
Après plusieurs recherches sur le net sans succès, j’ai décidé finalement de poster mon problème sur le forum, afin de trouver si possible une solution à mon problème.
J’ai pu mettre en place un ken burns effect qui fonctionne très bien. Code ci-dessous (A).
Mon problème, est le suivant :
Je n’arrive pas à faire fonctionner mon programme quand je l’intègre à mon site joomla. Je pense que le problème provient du faite que mon fichier n’arrive pas à lire la fonction crossSlide du fichier jquery.cross-slide.js.
Code (B), montre la manière dans j’ai inséré mon code dans l’index du site.
Quelqu'un pourra m’aider SVP ?
Dans l’attente, je vous souhaite une très belle soirée.
Cordialement,
Code (A):
<style type="text/css">
#crossslide{
width: 516px;
height: 152px;
position:relative;
border: none;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.js" type="text/javascript"></script>
<script src="jquery.cross-slide.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#crossslide').crossSlide({
fade: 8
}, [
{
src: 'AboutUs.jpg',
from: '50% 0% 5.9x',
to: '100% 80% 1x',
time: 6
}, {
src: 'technology.jpg',
href: 'http://www.w3c.org/',
from: '0% 100% 5.7x',
to: '100% 0% 1x',
time: 6
}, {
src: 'press.jpg',
href: 'http://www.php.net/',
from: '50% 0% 5.9x',
to: '100% 80% 1x',
time: 6
}, {
src: 'technology.jpg',
href: 'http://www.php.net/',
from: '100% 80% 1.9x',
to: '50% 0% 5.7x',
time: 6
}, {
src: 'support.jpg',
href: 'http://www.php.net/',
from: '50% 0% 5.9x',
to: '100% 80% 1x',
time: 6
}
]);
});
</script>
<div id="crossslide">Loading...</div>
Code (B)
<head>
<script type="text/javascript" src="<?php echo $this->baseurl ?>/templates/beez_20/javascript/jquery.js"></script>
<script type="text/javascript" src="<?php echo $this->baseurl ?>/templates/beez_20/javascript/jquery.cross-slide.js"></script>
<script>
$(document).ready(function(){
$("#crossslide").crossSlide({
fade: 1
}, [
{
src: 'promotions/agadir/atlas-agadir.jpg',
from: '50% 0% 5.9x',
to: '100% 80% 1x',
time: 6
}, {
src: 'promotions/agadir/founty-agadir.jpg',
href: 'http://www.w3c.org/',
from: '0% 100% 5.7x',
to: '100% 0% 1x',
time: 6
}, {
src: 'promotions/agadir/founty-agadir.jpg',
href: 'http://www.php.net/',
from: '50% 0% 5.9x',
to: '100% 80% 1x',
time: 6
}, {
src: 'promotions/agadir/atlas-agadir.jpg',
href: 'http://www.php.net/',
from: '100% 80% 1.9x',
to: '50% 0% 5.7x',
time: 6
}, {
src: 'promotions/agadir/founty-agadir.jpg',
href: 'http://www.php.net/',
from: '50% 0% 5.9x',
to: '100% 80% 1x',
time: 6
}
]);
});
</script>
</head>
Commentaire