• Registered: 2012-09-16
  • Posts: 7

Topic: Disappearing code etc

I use BlueGriffon to write my pages.  I now have a small gallery on every page of the site, with a main one on www.la-matha.com/pictures.html .  I have a couple of minor issues:

I have just introduced a CSS menu on all the pages, but when I flip from "source" to "WISIWIG" the code <div id="juicebox-container"></div> disappears.  I have a manual work-around by writing that just before saving, but wondered if this was something you had seen before.

The main gallery on the pictures.html page does not show properly on first load - it is ok on refresh.  This is the same in chrome as well as IE; any ideas on a solution?

The small galleries on pictures.html and guestbook.html do not show - simply a white field in the table.  I've checked the code, which appears to be the same as all the other pages.

Thank you for your help - it is very useful for a novice like me

Denis

  • Registered: 2012-04-24
  • Posts: 5,906

Re: Disappearing code etc

I have just introduced a CSS menu on all the pages, but when I flip from "source" to "WISIWIG" the code <div id="juicebox-container"></div> disappears.

This may simply be a limitation of the browser built in to BlueGriffon. In order to preview your gallery, I would recommend viewing your page in a standard browser (such as Firefox, IE, Chrome or Safari).
(There is a similar limitation in Dreamweaver whereby the Juicebox gallery will not show in Dreamweaver's design preview.)

The main gallery on the pictures.html page does not show properly on first load - it is ok on refresh.  This is the same in chrome as well as IE; any ideas on a solution?

Check your page's code with the W3C Markup Validation Service and fix any errors that are reported.

The small galleries on pictures.html and guestbook.html do not show - simply a white field in the table.  I've checked the code, which appears to be the same as all the other pages.

You have two galleries on your page but both galleries are embedded into the same container.
You need to embed each gallery into a <div> with a unique id.
For example:

<script src="jbcore/juicebox.js"></script>

<script>
    new juicebox({
        containerId : "juicebox-container1",
    });
</script>
<div id="juicebox-container1"></div>

<script>
    new juicebox({
        containerId : "juicebox-container2",
    });
</script>
<div id="juicebox-container2"></div>
  • Registered: 2012-09-16
  • Posts: 7

Re: Disappearing code etc

Thank you for your response.  I think I will have to live with the bug - it only started happening when I introduced the CSS menu.

As for the first load of the gallery - there was another error on the site, and to resolve that, I've changed the doctype for all pages, and this is now resolved.

Finally - the page with two galleries now works by using a differently named container for the second one (seems logical now that I think of it!), but the other page:

www.la-matha.com/guestbook.html

only has one, and it has the same code for the gallery as all the other pages.

  • Registered: 2012-04-24
  • Posts: 5,906

Re: Disappearing code etc

You are missing a closing ) from the end of your gallery's embedding code.
Change:

<script>
new juicebox({
  baseUrl :"jb_small/",
containerId : "juicebox-container",
galleryWidth: "300",
galleryHeight: "200",
backgroundColor: "#222222"
}</script>

... to:

<script>
    new juicebox({
        baseUrl: "jb_small/",
        containerId: "juicebox-container",
        galleryWidth: "300",
        galleryHeight: "200",
        backgroundColor: "#222222"
    });
</script>
  • Registered: 2012-09-16
  • Posts: 7

Re: Disappearing code etc

That works - thank you. V helpfull