Fork me on GitHub




« 1 2 3 4 (5) 6 7 »


Re: défilement de photos à la place des bannières
Régulier
Inscrit: 04/09/2005 16:44
De Belgique - Villers la ville
Messages: 384
ça ne change rien.
mais comme je ne suis pas doué....

quand je vais sur le lien
http://www.pharmacieparvais.com/site/ ... ameworks/jquery/jquery.js

j'ai un 404 not found.
et si je n'avais pas jquery

ou bien....

ou si quelqu'un peut bidouiller le truc
ou si quelqu'un a un système plus facile (à mon niveau)

un peu désespéré par mon niveau ^^

Posté le : 16/10/2014 21:17

---------------
Merci à vous
---------------

Merentar
Partager Twitter Partagez cette article sur GG+
Re: défilement de photos à la place des bannières
Admin Frxoops
Inscrit: 04/03/2011 09:10
De Lot
Messages: 2837
J'ai dis l'URL de ton site, pas l'URL de ton thème

donc http://www.pharmacieparvais.com/brows ... ameworks/jquery/jquery.js


Posté le : 16/10/2014 22:23
Partager Twitter Partagez cette article sur GG+
Re: défilement de photos à la place des bannières
Régulier
Inscrit: 04/09/2005 16:44
De Belgique - Villers la ville
Messages: 384
merci

pour le jquery.ui.js aussi?

où dois je mettre la partie qui sert a configurer le slider?

Mille mercis pour ta patience.

Posté le : 16/10/2014 22:29

---------------
Merci à vous
---------------

Merentar
Partager Twitter Partagez cette article sur GG+
Re: défilement de photos à la place des bannières
Régulier
Inscrit: 04/09/2005 16:44
De Belgique - Villers la ville
Messages: 384
question idiote mais on ne sait jamais.

jqyerry est d'office dans xoops ou il faut le télécharger?

Posté le : 24/10/2014 20:24

---------------
Merci à vous
---------------

Merentar
Partager Twitter Partagez cette article sur GG+
Re: défilement de photos à la place des bannières
Admin Frxoops
Inscrit: 04/03/2011 09:10
De Lot
Messages: 2837
jQuery est disponible dans Xoops, répertoire ./xoops_lib/Frameworks/jquery

Posté le : 24/10/2014 21:43
Partager Twitter Partagez cette article sur GG+
Re: défilement de photos à la place des bannières
Régulier
Inscrit: 04/09/2005 16:44
De Belgique - Villers la ville
Messages: 384
bonjour

je reviens vers vous, après un petit temps d'abandon.

je n'y arrive vraiment pas. je ne vois pas ce qui ne va pas. je suis trop (peut-être) novice.

Quelqu'un pourrait me modifier ma page?

Mille mercis



Posté le : 15/01/2015 18:42

---------------
Merci à vous
---------------

Merentar
Partager Twitter Partagez cette article sur GG+
Re: défilement de photos à la place des bannières
Régulier
Inscrit: 04/09/2005 16:44
De Belgique - Villers la ville
Messages: 384
j'ai essayé en javascript
en l'intégrant dans le tableau de mon thème

<div id="xo-canvas">

  <
table border="0" width="100%" cellspacing="1">

    <
tr>

      <
td valign="top"><div id="logo1">

      <
a href="http://monsite.com/site/modules/news/"><img src="<{xoImgUrl images/stairs2.jpg }>"></a>

    </
div></td>

       <
td width="81%" height="129" align="left"><script>
var 
alecran='image1';
function 
diaporama(){
if (
alecran=='image1') {document.getElementById('diapo').setAttribute('src','http://monsite.com/site/images/nouv/bannieres/champignons/02.jpg');
alecran 'image2';
} else if (
alecran=='image2') {document.getElementById('diapo').setAttribute('src','http://monsite.com/site/images/nouv/bannieres/champignons/03.jpg');
alecran 'image3';
} else if (
alecran=='image3') {document.getElementById('diapo').setAttribute('src','http://monsite.com/site/images/nouv/bannieres/champignons/04.jpg');
alecran 'image4';
} else if (
alecran=='image4') {document.getElementById('diapo').setAttribute('src','http://monsite.com/site/images/nouv/bannieres/champignons/01.jpg');
alecran 'image1';
}
}
</script></div></td>

          

        </table>


mais il ne s'affiche pas...

Posté le : 19/01/2015 20:36

---------------
Merci à vous
---------------

Merentar
Partager Twitter Partagez cette article sur GG+
Re: défilement de photos à la place des bannières
Admin Frxoops
Inscrit: 05/03/2005 05:20
De Vaucluse
Messages: 960
Bonsoir merentar,

Heuu, là ça part dans tous les sens...

1- Un script n'a rien à faire dans le corps de la page...
2- Ce script ne fait rien a part affecter une variable...
3- L'élément 'diapo' n'est pas défini non plus dans ta page....

Donc un peu normal que tout cela ne fonctionne pas.

Je pense que tu devrais repartir à zéro en suivant les instructions de bosco

Posté le : 20/01/2015 18:01

Open in new window

Xoops 2.5.7.2 - Debian 8.2 - Apache 2.4.10 - MySQL 5.5.47 - Php 5.6.17
Partager Twitter Partagez cette article sur GG+
Re: défilement de photos à la place des bannières
Régulier
Inscrit: 04/09/2005 16:44
De Belgique - Villers la ville
Messages: 384
merci pour ta réponse.

je suis débutant.
Et aussi, à force de chercher de ci- delà, le code ne ressemble plus à grand chose.

si une bonne âme pouvait me corriger le code, ce serait Noël.

Mille mercis

Posté le : 20/01/2015 20:22

---------------
Merci à vous
---------------

Merentar
Partager Twitter Partagez cette article sur GG+
Re: défilement de photos à la place des bannières
Team FrXoops
Inscrit: 07/08/2006 13:03
Messages: 1737
salut, tu dois repartir du début.
Tout d'abord, tu dois 3 fichiers.
Pour se faire, crée des fichiers .txt que tu rennomeras par la suite.
Le premier
responsiveslides.css
tu colles dedans
/*! http://responsiveslides.com v1.5 ... p;by @viljamis */ .rslides positionrelative; list-stylenoneoverflowhiddenwidth100%; padding0margin0; } .rslides li { -webkit-backface-visibilityhiddenpositionabsolutedisplaynonewidth100%; left0top0; } .rslides li:first-child positionrelativedisplayblockfloatleft; } .rslides img displayblockheightautofloatleftwidth100%; border0; }

Le second
responsiveslides.js
tu colles dedans
/*! ResponsiveSlides.js v1.54 * http://responsiveslides.com http://viljamis.com * * Copyright (c) 2011-2012 @viljamis * Available under the MIT license */ /*jslint browser: true, sloppy: true, vars: true, plusplus: true, indent: 2 */ (function ($, windowi) { $.fn.responsiveSlides = function (options) { // Default settings var settings = $.extend({ "auto": true, // Boolean: Animate automatically, true or false "speed": 500, // Integer: Speed of the transition, in milliseconds "timeout": 4000, // Integer: Time between slide transitions, in milliseconds "pager": false, // Boolean: Show pager, true or false "nav": true, // Boolean: Show navigation, true or false "random": true, // Boolean: Randomize the order of the slides, true or false "pause": false, // Boolean: Pause on hover, true or false "pauseControls": true, // Boolean: Pause when hovering controls, true or false "prevText": "Previous", // String: Text for the "previous" button "nextText": "Next", // String: Text for the "next" button "maxwidth": "", // Integer: Max-width of the slideshow, in pixels "navContainer": "", // Selector: Where auto generated controls should be appended to, default is after the <ul> "manualControls": "", // Selector: Declare custom pager navigation "namespace": "rslides", // String: change the default namespace used "before": $.noop, // Function: Before callback "after": $.noop // Function: After callback }, options); return this.each(function () { // Index for namespacing i++; var $this = $(this), // Local variables vendor, selectTab, startCycle, restartCycle, rotate, $tabs, // Helpers index = 0, $slide = $this.children(), length = $slide.size(), fadeTime = parseFloat(settings.speed), waitTime = parseFloat(settings.timeout), maxw = parseFloat(settings.maxwidth), // Namespacing namespace = settings.namespace, namespaceIdx = namespace + i, // Classes navClass = namespace + "_nav " + namespaceIdx + "_nav", activeClass = namespace + "_here", visibleClass = namespaceIdx + "_on", slideClassPrefix = namespaceIdx + "_s", // Pager $pager = $("<ul class='" + namespace + "_tabs " + namespaceIdx + "_tabs' />"), // Styles for visible and hidden slides visible = {"float": "left", "position": "relative", "opacity": 1, "zIndex": 2}, hidden = {"float": "none", "position": "absolute", "opacity": 0, "zIndex": 1}, // Detect transition support supportsTransitions = (function () { var docBody = document.body || document.documentElement; var styles = docBody.style; var prop = "transition"; if (typeof styles[prop] === "string") { return true; } // Tests for vendor specific prop vendor = ["Moz", "Webkit", "Khtml", "O", "ms"]; prop = prop.charAt(0).toUpperCase() + prop.substr(1); var i; for (i = 0; i < vendor.length; i++) { if (typeof styles[vendor[i] + prop] === "string") { return true; } } return false; })(), // Fading animation slideTo = function (idx) { settings.before(idx); // If CSS3 transitions are supported if (supportsTransitions) { $slide .removeClass(visibleClass) .css(hidden) .eq(idx) .addClass(visibleClass) .css(visible); index = idx; setTimeout(function () { settings.after(idx); }, fadeTime); // If not, use jQuery fallback } else { $slide .stop() .fadeOut(fadeTime, function () { $(this) .removeClass(visibleClass) .css(hidden) .css("opacity", 1); }) .eq(idx) .fadeIn(fadeTime, function () { $(this) .addClass(visibleClass) .css(visible); settings.after(idx); index = idx; }); } }; // Random order if (settings.random) { $slide.sort(function () { return (Math.round(Math.random()) - 0.5); }); $this .empty() .append($slide); } // Add ID's to each slide $slide.each(function (i) { this.id = slideClassPrefix + i; }); // Add max-width and classes $this.addClass(namespace + " " + namespaceIdx); if (options && options.maxwidth) { $this.css("max-width", maxw); } // Hide all slides, then show first one $slide .hide() .css(hidden) .eq(0) .addClass(visibleClass) .css(visible) .show(); // CSS transitions if (supportsTransitions) { $slide .show() .css({ // -ms prefix isn't needed as IE10 uses prefix free version "-webkit-transition": "opacity " + fadeTime + "ms ease-in-out", "-moz-transition": "opacity " + fadeTime + "ms ease-in-out", "-o-transition": "opacity " + fadeTime + "ms ease-in-out", "transition": "opacity " + fadeTime + "ms ease-in-out" }); } // Only run if there's more than one slide if ($slide.size() > 1) { // Make sure the timeout is at least 100ms longer than the fade if (waitTime < fadeTime + 100) { return; } // Pager if (settings.pager && !settings.manualControls) { var tabMarkup = []; $slide.each(function (i) { var n = i + 1; tabMarkup += "<li>" + "<a href='#' class='" + slideClassPrefix + n + "'>" + n + "</a>" + "</li>"; }); $pager.append(tabMarkup); // Inject pager if (options.navContainer) { $(settings.navContainer).append($pager); } else { $this.after($pager); } } // Manual pager controls if (settings.manualControls) { $pager = $(settings.manualControls); $pager.addClass(namespace + "_tabs " + namespaceIdx + "_tabs"); } // Add pager slide class prefixes if (settings.pager || settings.manualControls) { $pager.find('li').each(function (i) { $(this).addClass(slideClassPrefix + (i + 1)); }); } // If we have a pager, we need to set up the selectTab function if (settings.pager || settings.manualControls) { $tabs = $pager.find('a'); // Select pager item selectTab = function (idx) { $tabs .closest("li") .removeClass(activeClass) .eq(idx) .addClass(activeClass); }; } // Auto cycle if (settings.auto) { startCycle = function () { rotate = setInterval(function () { // Clear the event queue $slide.stop(true, true); var idx = index + 1 < length ? index + 1 : 0; // Remove active state and set new if pager is set if (settings.pager || settings.manualControls) { selectTab(idx); } slideTo(idx); }, waitTime); }; // Init cycle startCycle(); } // Restarting cycle restartCycle = function () { if (settings.auto) { // Stop clearInterval(rotate); // Restart startCycle(); } }; // Pause on hover if (settings.pause) { $this.hover(function () { clearInterval(rotate); }, function () { restartCycle(); }); } // Pager click event handler if (settings.pager || settings.manualControls) { $tabs.bind("click", function (e) { e.preventDefault(); if (!settings.pauseControls) { restartCycle(); } // Get index of clicked tab var idx = $tabs.index(this); // Break if element is already active or currently animated if (index === idx || $("." + visibleClass).queue('fx').length) { return; } // Remove active state from old tab and set new one selectTab(idx); // Do the animation slideTo(idx); }) .eq(0) .closest("li") .addClass(activeClass); // Pause when hovering pager if (settings.pauseControls) { $tabs.hover(function () { clearInterval(rotate); }, function () { restartCycle(); }); } } // Navigation if (settings.nav) { var navMarkup = "<a href='#' class='" + navClass + " prev'>" + settings.prevText + "</a>" + "<a href='#' class='" + navClass + " next'>" + settings.nextText + "</a>"; // Inject navigation if (options.navContainer) { $(settings.navContainer).append(navMarkup); } else { $this.after(navMarkup); } var $trigger = $("." + namespaceIdx + "_nav"), $prev = $trigger.filter(".prev"); // Click event handler $trigger.bind("click", function (e) { e.preventDefault(); var $visibleClass = $("." + visibleClass); // Prevent clicking if currently animated if ($visibleClass.queue('fx').length) { return; } // Adds active class during slide animation // $(this) // .addClass(namespace + "_active") // .delay(fadeTime) // .queue(function (next) { // $(this).removeClass(namespace + "_active"); // next(); // }); // Determine where to slide var idx = $slide.index($visibleClass), prevIdx = idx - 1, nextIdx = idx + 1 < length ? index + 1 : 0; // Go to slide slideTo($(this)[0] === $prev[0] ? prevIdx : nextIdx); if (settings.pager || settings.manualControls) { selectTab($(this)[0] === $prev[0] ? prevIdx : nextIdx); } if (!settings.pauseControls) { restartCycle(); } }); // Pause when hovering navigation if (settings.pauseControls) { $trigger.hover(function () { clearInterval(rotate); }, function () { restartCycle(); }); } } } // Max-width fallback if (typeof document.body.style.maxWidth === "undefined" && options.maxwidth) { var widthSupport = function () { $this.css("width", "100%"); if ($this.width() > maxw) { $this.css("width", maxw); } }; // Init fallback widthSupport(); $(window).bind("resize", function () { widthSupport(); }); } }); }; })(jQuery, this, 0);


Le troisieme
responsiveslides.min.js
tu colles dedans
/*! http://responsiveslides.com v1.5 ... p;by @viljamis */ (function(c,I,B){c.fn.responsiveSlides=function(l){var a=c.extend({auto:!0,speed:500,timeout:4E3,pager:!1,nav:!1,random:!1,pause:!1,pauseControls:!0,prevText:"Previous",nextText:"Next",maxwidth:"",navContainer:"",manualControls:"",namespace:"rslides",before:c.noop,after:c.noop},l);return this.each(function(){B++;var f=c(this),s,r,t,m,p,q,n=0,e=f.children(),C=e.size(),h=parseFloat(a.speed),D=parseFloat(a.timeout),u=parseFloat(a.maxwidth),g=a.namespace,d=g+B,E=g+"_nav "+d+"_nav",v=g+"_here",j=d+"_on"w=d+"_s",k=c("<ul class='"+g+"_tabs "+d+"_tabs' />"),x={"float":"left",position:"relative",opacity:1,zIndex:2},y={"float":"none",position:"absolute",opacity:0,zIndex:1},F=function(){var b=(document.body||document.documentElement).style,a="transition";if("string"===typeof b[a])return!0;s=["Moz","Webkit","Khtml","O","ms"];var a=a.charAt(0).toUpperCase()+a.substr(1),c;for(c=0;c<s.length;c++)if("string"===typeof b[s[c]+a])return!0;return!1}(),z=function(b){a.before(b);F?(e.removeClass(j).css(y).eq(b).addClass(j).css(x), n=b,setTimeout(function(){a.after(b)},h)):e.stop().fadeOut(h,function(){c(this).removeClass(j).css(y).css("opacity",1)}).eq(b).fadeIn(h,function(){c(this).addClass(j).css(x);a.after(b);n=b})};a.random&&(e.sort(function(){return Math.round(Math.random())-0.5}),f.empty().append(e));e.each(function(a){this.id=w+a});f.addClass(g+" "+d);l&&l.maxwidth&&f.css("max-width",u);e.hide().css(y).eq(0).addClass(j).css(x).show();F&&e.show().css({"-webkit-transition":"opacity "+h+"ms ease-in-out","-moz-transition":"opacity "h+"ms ease-in-out","-o-transition":"opacity "+h+"ms ease-in-out",transition:"opacity "+h+"ms ease-in-out"});if(1<e.size()){if(D<h+100)return;if(a.pager&&!a.manualControls){var A=[];e.each(function(a){a+=1;A+="<li><a href='#' class='"+w+a+"'>"+a+"</a></li>"});k.append(A);l.navContainer?c(a.navContainer).append(k):f.after(k)}a.manualControls&&(k=c(a.manualControls),k.addClass(g+"_tabs "+d+"_tabs"));(a.pager||a.manualControls)&&k.find("li").each(function(a){c(this).addClass(w+(a+1))});if(a.pager||a.manualControls)qk.find("a"),r=function(a){q.closest("li").removeClass(v).eq(a).addClass(v)};a.auto&&(t=function(){p=setInterval(function(){e.stop(!0,!0);var b=n+1<C?n+1:0;(a.pager||a.manualControls)&&r(b);z(b)},D)},t());m=function(){a.auto&&(clearInterval(p),t())};a.pause&&f.hover(function(){clearInterval(p)},function(){m()});if(a.pager||a.manualControls)q.bind("click",function(b){b.preventDefault();a.pauseControls||m();b=q.index(this);n===b||c("."+j).queue("fx").length||(r(b),z(b))}).eq(0).closest("li").addClass(v), a.pauseControls&&q.hover(function(){clearInterval(p)},function(){m()});if(a.nav){g="<a href='#' class='"+E+" prev'>"+a.prevText+"</a><a href='#' class='"+E+" next'>"+a.nextText+"</a>";l.navContainer?c(a.navContainer).append(g):f.after(g);var d=c("."+d+"_nav"),G=d.filter(".prev");d.bind("click",function(b){b.preventDefault();b=c("."+j);if(!b.queue("fx").length){var d=e.index(b);b=d-1;d=d+1<C?n+1:0;z(c(this)[0]===G[0]?b:d);if(a.pager||a.manualControls)r(c(this)[0]===G[0]?b:d);a.pauseControls||m()}}); a.pauseControls&&d.hover(function(){clearInterval(p)},function(){m()})}}if("undefined"===typeof document.body.style.maxWidth&&l.maxwidth){var H=function(){f.css("width","100%");f.width()>u&&f.css("width",u)};H();c(I).bind("resize",function(){H()})}})}})(jQuery,this,0);


lorsque c'est fait, tu glisses ces trois fichier et tes trois images que tu nommes 1.jpg 2.jpg et 3.jpg a la racine de ton theme

Ensuite.

Tu ouvres theme.html

juste avant </head> tu colles
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script src="<{$xoops_imageurl}>/responsiveslides.min.js"></script>  <script>   $(function() {     $(".rslides").responsiveSlides();   }); </script>


juste apres <header> tu colles
<ul class="rslides">
  <
li><img src="<{$xoops_imageurl}>/1.jpg" alt=""></li>
  <
li><img src="<{$xoops_imageurl}>/2.jpg" alt=""></li>
  <
li><img src="<{$xoops_imageurl}>/3.jpg" alt=""></li>
</
ul>


Ensuite tu ouvres styles.css
tu colles
@import url(responsiveslides.css);


Ca devrait le faire si j'ai rien oublié.

Posté le : 21/01/2015 10:30
Partager Twitter Partagez cette article sur GG+

 Haut   Précédent   Suivant
« 1 2 3 4 (5) 6 7 »



Vous pouvez voir les sujets.
Vous ne pouvez pas débuter de nouveaux sujets.
Vous ne pouvez pas répondre aux contributions.
Vous ne pouvez pas éditer vos contributions.
Vous ne pouvez pas effacez vos contributions.
Vous ne pouvez pas ajouter de nouveaux sondages.
Vous ne pouvez pas voter en sondage.
Vous ne pouvez pas attacher des fichiers à vos contributions.
Vous ne pouvez pas poster sans approbation.

Propulsé avec XOOPS | Graphisme adapté par Tatane, Grosdunord, Montuy337513

51 Personne(s) en ligne (35 Personne(s) connectée(s) sur Forum) | Utilisateur(s): 0 | Invité(s): 51 | Plus ...