WebSite X5Help Center

 
Gerard V.
Gerard V.
User

Photo slider on my new website with X5v11 pro won't work (works in v10 pro)  en

Autor: Gerard V.
Visitado 2564, Seguidores 1, Compartilhado 0  

Hello, Photo slider on my new website with X5v11 pro won't work, with my old site and with X5v10 pro it does work, can anyone help? (old site see: http://atelierhermina.nl/)

I linkt the files css, js and js to the html code from the body.

In the head:

<head>

<title>Atelier Hermina</title>

<meta charset="utf-8" />

<!--[if IE]><meta http-equiv="ImageToolbar" content="False" /><![endif]-->

<meta name="description" content="Atelier voor o.a. Quilts, Plaids, Patchwork, Schilderijen, Wandkleden, Spreien, Kussens, Tassen, Bewaardozen.&lt;br /&gt;&lt;br /&gt;" />

<meta name="author" content="Gerard van Heck" />

<meta name="generator" content="Incomedia WebSite X5 Professional 11.0.2.14 - www.websitex5.com" />

<meta name="viewport" content="width=993" />

<link rel="stylesheet" type="text/css" href="style/reset.css" media="screen,print" />

<link rel="stylesheet" type="text/css" href="style/print.css" media="print" />

<link rel="stylesheet" type="text/css" href="style/style.css" media="screen,print" />

<link rel="stylesheet" type="text/css" href="style/template.css" media="screen" />

<link rel="stylesheet" type="text/css" href="style/menu.css" media="screen" />

<!--[if lte IE 7]><link rel="stylesheet" type="text/css" href="style/ie.css" media="screen" /><![endif]-->

<link rel="stylesheet" type="text/css" href="pcss/index.css" media="screen" />

<link rel="stylesheet" type="text/css" href="files/beeldscroller.css" media="screen, print" />

<script type="text/javascript" src="res/jquery.js?14"></script>

<script type="text/javascript" src="res/x5engine.js?14"></script>

<script type="text/javascript" src="res/x5engine.offline.js?14_635525352428283043"></script>

<script type="text/javascript" src="files/beeldscroller.js"></script>

<script type="text/javascript" src="files/beeldscrollervb.js"></script>

<link rel="stylesheet" type="text/css" href="files/beeldscroller.css" media="screen, print" />

<script type="text/javascript" src="files/beeldscroller.js"></script>

<script type="text/javascript" src="files/beeldscrollervb.js"></script>

</head>

In the body:

 <div id='right'>
  <a href='#' title='foto1'><img src='../pics/foto1.jpg' /></a>
  <a href='#' title='foto2'><img src='../pics/foto2.jpg' /></a>
  <a href='#' title='foto3'><img src='../pics/foto3.jpg' /></a>
  <a href='#' title='foto4'><img src='../pics/foto4.jpg' /></a>
  <a href='#' title='foto5'><img src='../pics/foto5.jpg' /></a>
  <a href='#' title='foto6'><img src='../pics/foto6.jpg' /></a>
  <a href='#' title='foto7'><img src='../pics/foto7.jpg' /></a>
  <a href='#' title='foto8'><img src='../pics/foto8.jpg' /></a>
 </div>

Publicado em
16 RESPOSTAS - 1 CORRIGIR
Incomedia
Claudio D.
Incomedia

Hello Gerard,

Unfortunately I cannot help you with the use of custom code since the functions do not depend on WebSite X5.

To be able to see what could cause the issue to get help also from one someone of the community it would be more helpful if you upload the project with the code online to see if. You can also upload it in a subfolder on your hosting space and write here the link to it.

Many thanks!

Ler mais
Publicado em de Claudio D.
Gerard V.
Gerard V.
User
Autor

Hello Claudio, i'm a little dissapointed here, i just wondering because i do the same in X5v10 pro as in X5v11 pro, in 10 it works and in 11 not, so what is the diffents? Or can you advise another (x5tuts) slider that works and do the job i want? I will also try and set it up in a sub folder of my one.com space. Regards, Gerard

Ler mais
Publicado em de Gerard V.
Paul M.
Paul M.
Moderator

Hello Gerard,

Did you upload the v11 site to a different web host/server compared to the v10 site?

A link to the v11 site would be very useful, just like Claudio suggests.

Kind regards,

Paul

Ler mais
Publicado em de Paul M.
Gerard V.
Gerard V.
User
Autor

Hello, the link to the v11 site is here: http://atelierhermina.nl/X5v11pro/index.html

The link to the original is here: http://atelierhermina.nl

The v10 i did not put online, but it worked lokal just like the original, in v11 i made it exactly the same as in v10.

I realy hope you can help me because i did not purcase the v11 pro to have already such problems. Or advice me a diffent and good slider wich will do the same.

Regards, Gerard

Ler mais
Publicado em de Gerard V.
Paul M.
Paul M.
Moderator

The path to your JavaScript is not correct, Gerard...

Compare what your code is looking for:

http://atelierhermina.nl/X5v11pro/files/beeldscroller.js  (<script type="text/javascript" src="files/beeldscroller.js</b>"></script>)

With where you have actually placed the JavaScript on the server:

http://atelierhermina.nl/X5v11pro/beeldscroller.js

Hope that helps...

Please note that this is not a defect in WebSite X5.

Can you post a link to the source code for the 'beeldscroller' script to see if I can spot anything else?

I am wondering if the script is compatible with later versions of jQuery?  The only source code I could find online referenced a very old jQuery version...  1.2

Best wishes,

Paul

Ler mais
Publicado em de Paul M.
Gerard V.
Gerard V.
User
Autor

Hello Paul, i do not now were you find the "files/beeldscroller" because i put everything in the root, but i made a map with the "files" in the root and in the root for "X5v11pro" and it still does not work.

Wich source code you mean ?

Is it easyer to use a new slider to do the things i want ?

Greetings, Gerard

Ler mais
Publicado em de Gerard V.
Paul M.
Paul M.
Moderator
Gerard V.
Hello Paul, i do not now were you find the "files/beeldscroller"...

Hi Gerard, I was referring to the code you quoted in your original post:

<script type="text/javascript" src="files/beeldscroller.js"></script>

<script type="text/javascript" src="files/beeldscrollervb.js"></script>

<link rel="stylesheet" type="text/css" href="files/beeldscroller.css" media="screen, print"

But no matter, I have created a new project in Professional 11 and followed the instructions on the users.skynet.be site to install the beeldscroller, and I can confirm it is working.

I shall post screenshots to illustrate...  it's probably easier than explaining verbally...  but if you are unsure of any point please ask, as the code definitely works!

First screenshot is attached to this post...  note I have kept the code as listed on the users.skynet.be site intact, including the reference to jQuery 1.2

Kind regards,

Paul

Ler mais
Publicado em de Paul M.
Paul M.
Paul M.
Moderator

HTML Code Object in body of the page...

Ler mais
Publicado em de Paul M.
Paul M.
Paul M.
Moderator

Properties of HTML Code Object with code pasted in place...

Note the tick in the 'Enable automatic height' checkbox, and that I have deselected the 'Show scrollbars' checkbox

Ler mais
Publicado em de Paul M.
Paul M.
Paul M.
Moderator

Grrrr...  last screen shot repeated by mistake!!  Should be this one...  sorry...

Ler mais
Publicado em de Paul M.
Paul M.
Paul M.
Moderator

'Expert tab' of the afore-mentioned HTML Code Object...

Note the paths to the 'Files linked to HTML Code'

Ler mais
Publicado em de Paul M.
Paul M.
Paul M.
Moderator

Last screenshot, showing the scroller working in the preview...  

Ler mais
Publicado em de Paul M.
Gerard V.
Gerard V.
User
Autor

Hi Paul, thank you very much, this indeed did put me in the right direction, thanks again!

But its realy strange, when i did exactly what you did ... it did not work ... I tryed all the other options and one time the slider worked only in the preview but not in the IE, a other option it not workt in IE but not in the preview.

Everytime you link files in the expert tab, it does not work, because of a "js" that comes out of the "res" folder, this is also different than in the older version:

-----

linking the files to the html code:

<script type="text/javascript" src="res/jquery.js?14"></script>

<script type="text/javascript" src="res/x5engine.js?14"></script>

<script type="text/javascript" src="res/x5engine.offline.js?14_635527650849978810"></script>

-----

I did the job now by putting the next lines only in the header (expert tab) and only in the body as html code on the page: 

-----

in the header: 

<link rel="stylesheet" type="text/css" href="beeldscroller/beeldscroller.css" />

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2/jquery.min.js"></script>

<script type='text/javascript' src="beeldscroller/beeldscroller.js"></script>

<script type='text/javascript' src="beeldscroller/beeldscrollervb.js"></script>

in the body:

<div id='right'>
<a href='#' title='foto1'><img src='beeldscroller/foto1.jpg' /></a>
<a href='#' title='foto2'><img src='beeldscroller/foto2.jpg' /></a>
<a href='#' title='foto3'><img src='beeldscroller/foto3.jpg' /></a>
<a href='#' title='foto4'><img src='beeldscroller/foto4.jpg' /></a>
<a href='#' title='foto5'><img src='beeldscroller/foto5.jpg' /></a>
<a href='#' title='foto6'><img src='beeldscroller/foto6.jpg' /></a>
<a href='#' title='foto7'><img src='beeldscroller/foto7.jpg' /></a>
<a href='#' title='foto8'><img src='beeldscroller/foto8.jpg' /></a>
</div>

-----

Is this a problem with linking the files in X5v11pro ? Is it fixable ?

Best regards,

Gerard

Ler mais
Publicado em de Gerard V.
Paul M.
Paul M.
Moderator

Hi Gerard,

No, it's not a problem with WebSite X5.  There are a few factors to bear in mind.

Firstly, the beeldscroller is rather old code, which uses an older jQuery library.  There are differences in the various jQuery versions as I'm sure you already know, which can cause incompatibilities.  WebSite X5 comes 'bundled' with a much newer version of jQuery (1.8 if I remember correctly).

WebSite X5 makes use of the jQuery library itself, so the reference cannot be removed in the code.  If there is a conflict then the beeldscroller code must be manually edited to suit, and not the other way around.

There are lots of 'access points' in X5 which allow the insertion of custom code.  And if more major editing is required then it can be done in Step 5, by exporting the HTML code to disk before uploading to the web.

I can't think why you had issues with the slider not working if you followed the steps in my screenshots?  You didn't confuse the 'Expert' tab on the HTML Code Object with the 'Expert' tab on the page properties (in Step 2) by any chance?

Best wishes,

Paul

Ler mais
Publicado em de Paul M.
Gerard V.
Gerard V.
User
Autor

Hi Paul, no i did it right, but still i understand much more now and thats super helpfull, thanks again. Greetings Gerard

Ler mais
Publicado em de Gerard V.