Comment marche Highslide JS?

Bonjour,

J'ai trouvé sur ce site un truc tres sympa et il me semble que c'est du AJAX, mais savez vous comment il fonctionne et si on peut l'adapter a cariboost?

http://vikjavev.no/highslide/

Bonjour Poil2Krot,

C'est excellent ce truc là ! Bonne pioche...

A priori, c'est du JavaScript + CSS donc ça ne devrait pas trop poser de problême à intégrer cela dans une page Cariboost...

Tu me laisses le temps de rédiger un tuto demain ?

Merci pour le lien

Pierre

PS : sujet déplacé dans la bonne rubrique

Alors vraiment tu es un As .

Je peux bien sur attendre demain.

Merci d'avance.

Et bon courage, je continu de chercher de mon coté mais aie aie pour moi tres dur.....

Salut,
c'est clair que c'est très bien.
J'ai fait un essai, en chargeant tout sur un répertoire dans le ftp, ça à l'air de fonctionner, mais j'ai du mal à paramétrer.
Vivement le tuto de Pierre !

Bon j'ai eu beau cherché une bonne partie de la nuit, je n'ai pas réussi a comprendre comment inserer sur cari et surtout le personnaliser, mais le fait du flash, de la frame, et l'affichage des photo, cela est super. Vivement le tuto de pierre (comme tu dis Jeronimo)

As tu reussi a le faire fonctionné Pierre?

Bonsoir,

bien sûr que j'ai réussi à le faire fonctionner...

Mais rédiger un tuto clair et compréhensible est plus long et complexe qu'il n'y parait, cher poil2krot...

On commencera par le commencement : quelle application précise veux tu mettre en oeuvre dans un premier temps (je pense que tu as vu qu'il y a des dizaines d'utilisation possibles, et dans la rédaction de mon tuto, je n'ai peut-être pas la même approche que toi, coté priorités)

Cordialement,

Pierre

Oui je comprend la difficulté de rediger un tuto, je n'ai pas vu autant de possibilité, je n'ai vu que les photos qui s'agrandissent, les frames, texte et flash.
Qu'y a t'il d'autre?

pour ma part la fonction photos me plait bien aussi que le texte avec photo incorporé.
La fonction avec HTML, je ne sais pas a quoi elle peut servir non plus...

Suis pas du tout un pro

Salut,
j'ai essayé hier, et c'est vrai qu'il y a différentes possibilités différentes de présentation des photos, et que l'installation peut être différente selon les présentations.
Donc, poil2krot, je penses que tu devrais dire quelle est la présentation qui t'intéresse (son nom, une copie d'écran...) afin de pouvoir être mieux orienté...
(Et merci de nous avoir fait connaitre ça, ça à l'air vraiment bien)
Jero

mais tu trouve ca ou les diverses presentations?
C'est sur cette page la?

http://vikjavev.no/highslide/index.htm

Ah ca y est ai compris, alors suis peut etre gourmand, mais donc en priorité, souhaiterais intégré celui la :http://vikjavev.no/highslide/example-slideshow-controlbar.html


Dans un second temps :http://vikjavev.no/highslide/example-white-10px.html



et si possible par la suite cela:http://vikjavev.no/highslide/example-html.html

Mais je pense que lorsque j'en aurais fais un, ensuite le mode doit etre a peu pres pareil.

Bonjour (eh oui, il est déjà demain !!! )

les exemples sont ici : http://vikjavev.no/highslide/#examples

un début d'intégration à Cariboost là : http://pierre.marechal.free.fr/imagine/crbst_152.html (où sera publié le tuto, donc à mettre en Favori ! )

Bonne nuit, et à tout à l'heure !

oui ca yest pierre viens de comprendre
lol
Je regarde actuellement, mais il charge sans rien faire
(La vidéo est pour l'instant trop lourde, suis en train de l'alléger - Admin)

Oui ca y est ai vu, tu es trop bon.
Bonne nuit a toi

Bravo Pierre viens d'allé voir le resultat sur ta page, c'est super, rapide en plus.
J'ai essayer de faire aussi en recuperant code source. Mais bon il faut me resoudre... Je comprend rien du tout.

Allé je réessaye

Sois patient... j'ai galéré un peu pour le flash (conflits avec Caribou, comme prévu ), et j'ai dû bidouiller pour adapter. Attends donc des explications claires avant de "faire des bétises" ! ou du moins perdre trop de temps !

Cordialement,

Pierre

Oui tu as raison, je suis un préssé de nature....

j'attend patiement. merci en tout cas de ton aide

Bonjour,
Je viens de me rendre sur la page et bien dis donc Pierre tu as travaillé jour et nuit!!!!
Je vais essayer tontuto et encore merci et bravo

Les tutos sont en cours de rédaction (mon Dieu ce que tu es impatient ! ) et seront disponibles en fin d'après midi.

Avertissement : en attendant, révises tes cours de HTML et de CSS, tu vas en avoir besoin !

Oui suis désolé suis trop impatient. Avais pas vu que les liens tuto étit en cours
Pour ce qui est des cours de HTML et CSS, il faudrait deja avoir les bases lol je n'y connait rien je verais le moment venus

@Poil2krot va faire un tour sur ce site
tu auras quelques notions de Html et CSS


http://info.sio2.be/kpz/index.php

Ce lien se trouve aussi dans la rubrique adresses utiles.

Cordialement.
Microbull.

[EDIT] Post déplacé par Admin

Bonsoir,

Premier tuto en ligne (désolé, plus long que prévu...) :

du Contenu HTML en Slide : http://pierre.marechal.free.fr/imagine/crbst_163.html

Le reste devrait suivre...

merci Pierre, beau travail apparement.
Je me plancherais dessus plus tard dans la semaine.
bonne soirée.
Merci encore

Bonjour,

Second tuto

Des photos en Slide : http://pierre.marechal.free.fr/imagine/crbst_166.html

Merci Piere et encore super boulot.
Je vais me mettre a l'oeuvre des ce soir je pense.
Merci encore car sans toi ma decouverte n'aurais rien donné.

Décidément qu'en on est pas doué!!!!
Viens de me prendre la tete durant plusieurs heures avec highslide , pour des images, et résultat NADA, pourtant le tuto est simple.

Apres un "s" en trop sur le dossier image, je vois maintenant mes images, en vignettes, le souci c'est que lorsque je clique dessus, elle s'ouvre dans une autre page! et non comme hightslide

Boisoir Poil2Krot,

URL de la page publiée stp

Bonsoir Lezebre

sur ma page d'accueil directement http://nikoj.free.fr

[EDIT] l'adresse des sites hébergés par Free ne commence jamais par www.

Re,

j'ai bien trouvé le dossier highslide sur ton hébergement, mais manifestement, il ne contient pas le fichier highslide.js.

Tout vient de là.

Cordialement

en ouvrant filezilla, je le trouve dans /highslide/highslide/highslide.js

https://servimg.com/view/11155610/6

poil2krot a écrit:je le trouve dans /highslide/highslide/highslide.js

Voila l'erreur : il y a un niveau de dossier en trop (/highslide! dans /highslide)
l'adresse correcte du fichier doit être : http://nikoj.free.fr/highslide/highslide.js

Merci lezebre, j'ai mis le fichier hightslipe a l'endroit indiqué, cela a bougé un peu mais pas encore réglé.
La suis "crevé", je te remercie pour ton aide, je vais reesayé des demain.
bonne nuit

Re,

comme je te l'indiquais plus haut, il y a un niveau de dossier en trop (édité en rouge dans la citation)

Tout le contenu du dossier highslide doit être au 1er niveau (un seul dossier highslide contenant les fichiers .js et le dossier /graphics etc...

Ah alors c’est le bazarre dans mon dossier, je viens a l’instant de telecharger le nouveau dossier hightslide-3.1.8 et en le décompressant je trouve :

1/ Dans le dossier décompressé « hightslide », je trouve 3 dossiers (Filer_fro_iframe, highslide et images) et 12 fichiers html et un fichier flash.

2/ Dans le dossier Filer_for_iframe : 4 fichiers GIF et un fichier nommé « deeds »

3/ Dans le dossier hightslide : 1 dossier graphics et 5 fichiers de type « JScript Script File »

4/ Dans le dossier images : 4 fichiers JPEG

Donc apparemment si je comprend bien, je fais un coupé/collé des 5 fichiers de type « JScript Script File » et du dossier graphics directement dans le premier dossier hightslide.

Ce qui me donnerais :

Dans le dossier décompressé « hightslide », je trouverais 4 dossiers (Filer_fro_iframe, highslide, graphics et images) et 12 fichiers html, les « fameux »5 fichiers de type « JScript Script File » et un fichier flash.

Et le reste je ne touche a rien?

Est-ce bien cela STP ?

Bonjour,

c'est bien le dossier highslide contenu dans le dossier highslide-3.1.8 qu'il faut uploader à la racine de ton hébergement, et tu pourras supprimer le dossier highslide contenu dans le dossier highslide... tu me suis ?

Bonjour,

Décidément suis vraiment nul

Alors le dossier décompressé il ne sert pas complètement ? Ou il est mal ordonné ?

Solution 1 :

A la racine du mon site, je ne met que le dossier Highslide qui contient les 5 fichiers de type « JScript Script File » et le dossier « graphics » ?
Et les autres dossiers je les supprime carrément (Filer_fro_iframe, 12 fichiers html et un fichier flash)

Solution 2 :

Je mets les 5 fichiers de type « JScript Script File » et le dossier « graphics », directement dand le dossier highslide avec tous les autres (Filer_fro_iframe, 12 fichiers html et un fichier flash)

Re,

Solution N°1, Monsieur Poil2krot...
les autres fichiers sont les fichiers-exemples, et n'ont donc aucune utilité sur ton site.

Cordialement,

LeZèbre

Merki beaucoup de ta patience et de ta disponibilité.

Ca fonctionne bien, encore des soucis de taille d'images avec forte pixelisation mais tout fonctionne super.

MERCI BEAUCOUP

Bonjour,
Apres plusieurs test, je n'arrive pas a avoir des vignettes d'aussi bonne qualité meme en petite taille, et de plus le temps pour ouvrir les image sous hightslide est plus long aussi que toi.
Quelle resolution et taille utilise tu pour que ce soit si nette et aussi rapide?

Bonjour Poil2Krot,

tes photos pèsent plus de 3 Mo pour chacune : : ne t'étonne pas que ce soit très long à charger (surtout chez Free ! )

Il faut redimensionner tes grandes photos dans un format compris entre 640x480 et 1024x768 pour faire baisser leur poids (et donc accélérer l'affichage). N'oublies pas de travailler sur des copies, pas sur les originaux.

Pour ce qui est de la qualité des vignettes et des photos, je les redimensionne avec Photoshop CS2, et leur applique un filtre de renforcement "Accentuation" à 20% sur un rayon d'1pixel et 0 niveau. Je pense qu'un logiciel comme Photofiltre t'offrira les mêmes performances, à toi de faire quelques essais préliminaires.

Cordialement,

Pierre

PS : ta page d'accueil aura besoin d'être "retravaillée" : les zones de Code HTML insérées avec le Caribou ne doivent pas comporter de balises <head></head>, <body></body>, <html></html>

Merci de precisions, je travail avec photofiltre, donc vais essayer de trouver la meme chose que ce que tu explique, accentuation.
merci
en ce qui concerne ma page d'accueil , je ne comprend pas ce que tu veux dire

poil2krot a écrit:en ce qui concerne ma page d'accueil , je ne comprend pas ce que tu veux dire

Réponse par Mail (ce n'est pas l'endroit pour en parler, il faudrait ouvrir 3 ou 4 sujets différents ! )

Cordialement

Bonsoir LeZebre,

Me revoici encore avec des soucis pour hightslide, mais cette fois ci avec le HTML, j'ai essayé de faire un liens HTML en slide, mais le texte se mets directement sur la page en dessous du lien qui lui ne fonctionne pas.
Je pense que mon soucis vient de l'insertion du fichier Texte en format html, en effet j'ai crée un texte sous le bloc note de windows et l'ai enregistré sous HTML.
Ensuite j'ai ouvert ce fichier HTML et copier son contenu dans ma zone Html sos cari***.

Mais rien ne se passe!!

Visiblie directement sur la page d'accueil de mon site en dessous les photos en slide.
nikoj.free.fr

Merci d'avance

Bonjour Poil2Krot,

cette ligne est manquante dans la partie head de ta page :

<script type="text/javascript" src="highslide/highslide-html.js"></script>

Cordialement

Bonjour,

J'avais découvert highslide il y a quelques temps sans m'en servir et maintenant j'y reviens mais ... je m'explique :
ce que j'ai fait :
- j'ai uploadé en FTP (avec Filezilla) le dossier highslide et son contenu au complet à la racine de mon site Web.
- J'ai préparé un texte sur le bloc note (pour essai) en html que j'ai uploadé sur mon site à l'adresse http://seniorsteoula.abelcv.com/textes/24fevrier2009.html
- Dans Cariboost : menu "Site Web -> propriétés du site Web" puis onglet "Avancé" j'ai inscrit les bibliothèques Javascript utilisées par Highslide en collant les lignes du script sans rien changé (coller-copier)
- J'ai inséré une zone de code HTML n’importe où sur la page où je travaille qui doit recevoir le style CSS nécessaire à Highslide JS et j'ai copié le script (toujours par copier-coller)
-A l’endroit désiré sur la page , j'ai inséré une "zone de Code HTML" avec le code ci dessous :

Code:

<a href="#" onclick="return hs.htmlExpand(this, { contentId: 'http://seniorsteoula.abelcv.com/textes/24fevrier2009.html-1} )"
class="highslide">
Resultats
</a>
<div class="highslide-html-content" id="http://seniorsteoula.abelcv.com/textes/24fevrier2009.html-1" style="width: 400px;">
<div style="height:20px; padding: 2px">
  <a href="#" onclick="return hs.close(this)" class="control">Fermer</a>
<a href="#" onclick="return false" class="highslide-move control">Déplacer</a>
</div>
<div class="highslide-body" style="padding: 0 10px 10px 10px">
http://seniorsteoula.abelcv.com/textes/24fevrier2009.html
</div></div>

Et bien sûr, si je vous écrit, c'est que ça ne fonctionne pas !
Je pense que celà vient du code ci dessus où j'ai dû faire une ou plusieurs erreurs mais je ne connais pas grand chose en html et donc je n'arrive pas à la ou les trouver.
Je fais donc appel aux spécialistes qui voudront bien m'aider.
En vous remerciant
Cordialement

Bonjour maxcv
Oui effectivement, le code ci-dessus contient des erreurs, je suis allée voir les explications de Pierre



Donc ce qui est en rouge c'est un nom que tu donnes au contenu tu pourrais très bien l'appeler toto, mais le nom doit être le même dans les 2 zones rouges et le texte que tu as mis sur ton fichier html doit être recopié à l'emplacement de la dernière zone bleue. Ce nom est important pour le fonctionnement si tu as d'autres zones à mettre, elles devront porter chacune un nom différent.
Tout ce qui est en bleu tu peux le modifier selon ce que tu veux
Il est inutile d'envoyer le fichier 24fevrier2009.html dans ton espace, il sert juste à préparer le texte html pour le recopier dans le code. à la place de la dernière zone bleue
J'oubliais, pour le mot Déplacer retire l'accent et remets comme Pierre avec le code qui remplace le caractère accentué.

Je remets l'adresse des explications de pierre ici

@ +

Bonsoir Babyl,

Merci pour tes explications un peu plus claire (pour moi !) que celle de Pierre ... mais je ne vais pas la lui jeter (la pierre), ça doit être très dur de faire un tuto pour des ignorants comme moi !
Je fais donc un essai et je reviens te dire ...

Désolé mais je ne peux plus mettre (publier) mon site à jour ....
J'ai rafraichi le site deux fois sans succès !
Je ne sais plus comment faire car ça m'était déjà arrivé ...je vais encore galéré !

Me revoilà : J'ai republier mon site en effaçant tout dans FileZilla , Rafraîchir dans Caribost et Publier. La mise à jour est faite.
Mais highslide ne fonctionne toujours pas ! voilà mon nouveau code :

Code:

<a href="#" onclick="return hs.htmlExpand(this, { contentId:'resultats02'} )"
class="highslide">
Resultats
</a>
<div class="highslide-html-content" id="resultats02" style="width: 400px;">
<div style="height:20px; padding: 2px">
  <a href="#" onclick="return hs.close(this)" class="control">Fermer</a>
<a href="#" onclick="return false" class="highslide-move control">Déplacer</a>
</div>
<div class="highslide-body" style="padding: 0 10px 10px 10px">
Resultats de la rencontre du 24 fevrier 2009 a Teoula :
1er : Martin Martin
2eme : Jean-Jean
</div></div>

J'ai appelé le contenu "resultats02" (sans accent) et noté une phrase quelconque en bas du code.

Par contre je viens de remarquer un truc bizzarre en haut, à gauche et à l'extérieur du site dans firefox, le début d'un script ! je ne trouve pas d'où ça vient :

Merci pour l'aide

Peux-tu nous donner l'adresse de la page pour voir d'où vient l'erreur, c'est sûrement un signe ou une balise manquante