Destiny
Posts: 69
Joined: Tue Sep 25, 2012 3:08 am
Location: Queensland Australia

Highslide Box to open inside a WebGL Page??

Mon Jul 02, 2018 2:16 am

Hi.. Do you think it might be possible to open a Highslide Box within a WebGL page. It is possible to add JS code to a template, but I was just wondering if anyone has done this..

Thank you

Destiny...

Destiny
Posts: 69
Joined: Tue Sep 25, 2012 3:08 am
Location: Queensland Australia

Re: Highslide Box to open inside a WebGL Page??

Tue Jul 03, 2018 12:37 am

Hi.. I managed to open the mini gallery using a html link which opens over the WebGL.. I see the little thumb image to open the gallery and it works. However, is there a way to go straight to the gallery on open the page.

Thank you..

MisterNeutron
Posts: 430
Joined: Sun Aug 18, 2013 11:20 am

Re: Highslide Box to open inside a WebGL Page??

Tue Jul 03, 2018 1:22 am

Assign an ID to the anchor, like:

Code: Select all

<a id='target' class='highslide' href='images/mydog.jpg' onclick='hsExpand....></a>
Then include this in your config:

Code: Select all

hs.addEventListener(window, "load", function() {
	document.getElementById('target').onclick();
});

Destiny
Posts: 69
Joined: Tue Sep 25, 2012 3:08 am
Location: Queensland Australia

Re: Highslide Box to open inside a WebGL Page??

Tue Jul 03, 2018 8:31 am

I really appreciate your help.. I know nothing about coding, so I do an awful lot of testing and getting nowhere.. No skill on my part if it work.. Its all guess work.. :oops:

Anyway... I replaced the code

<a id="thumb1" href="./images/gallery1.jpg" class="highslide" onclick="return hs.expand(this)">
<img src="./images/gallery1.thumb.jpg" alt="Highslide JS"
title="Click to enlarge" />
</a>

for this...

<a id='target' class='highslide' href='images/gallery1.jpg' onclick='hsExpand....></a>

I then added your other code into the head area.. With <script> and closed </script> sandwiched between your code..

I am guessing I did it wrong.. I am using the default mini-gallery. I just want that to open as a gallery without having to click on the little thumb image. Sorry if I am not explaining correctly.. Coding is simply not something my brain can cope with. Wonderful when it work, but painful when it doesn't...

I tried to add your other code onto an object so it linked to the WebGL, but that did not work either..

Destiny...

Destiny
Posts: 69
Joined: Tue Sep 25, 2012 3:08 am
Location: Queensland Australia

Re: Highslide Box to open inside a WebGL Page??

Tue Jul 03, 2018 8:37 am

I am guessing, that since I can open the HTML page OK, and all I need is the Auto Open Gallery, that when I open that page, the gallery should just open... Thats what I need it to happen.. But perhaps I have not added your code correctly..

Destiny...

MisterNeutron
Posts: 430
Joined: Sun Aug 18, 2013 11:20 am

Re: Highslide Box to open inside a WebGL Page??

Tue Jul 03, 2018 10:33 am

That anchor already has an ID on it, thumb1, so just use it.

Code: Select all

hs.addEventListener(window, "load", function() {
   document.getElementById('thumb1').onclick();
});

Destiny
Posts: 69
Joined: Tue Sep 25, 2012 3:08 am
Location: Queensland Australia

Re: Highslide Box to open inside a WebGL Page??

Tue Jul 03, 2018 11:15 am

Brilliant..! That now auto opens. But I would like that the little thumb image is not there at all.. Is the possible...

I have this code below by default.. I guess I could just make that thumb image a transparent png with nothing.. But editing the code would be better. I also guess I could just turn it into a button graphic with Play on it.. or an arrow.. But at least the main Auto Open is working which is great.. I will create a mock up and post it..

<a id="thumb1" href="./images/gallery1.jpg" class="highslide" onclick="return hs.expand(this)">
<img src="./images/gallery1.thumb.jpg" alt="Highslide JS"
title="Click to enlarge" />
</a>

Thank you so much. I could never have worked it out.. :D

Destiny...

MisterNeutron
Posts: 430
Joined: Sun Aug 18, 2013 11:20 am

Re: Highslide Box to open inside a WebGL Page??

Tue Jul 03, 2018 12:18 pm

That's just basic CSS. Wrap the anchor in a hidden div:

Code: Select all

<div style="display:none;"><a id="thumb1" href....></a></div>
The expander will launch from the middle of the page. If you want the expander to launch from where the hidden anchor is, use visibility:hidden; instead of display:none;

Destiny
Posts: 69
Joined: Tue Sep 25, 2012 3:08 am
Location: Queensland Australia

Re: Highslide Box to open inside a WebGL Page??

Wed Jul 04, 2018 1:12 am

Hi... I could not quite work that last code out, so I will play with it more...

This is our project so far.. We are however, having issues with the 3D models changing.. There seems to be a bug with the software.. When they are clicked on they are suppose to change..

But, if you click on the little i icon top of the last model, it works :D .. We still need to edit the code to try to remove the boarder around the Highslide box, which we think we can do, and also we will add a red X to close it..

But, here you can see it working as we would like it to..

http://members.westnet.com.au/dps/3D-In ... rking.html

Destiny...

MisterNeutron
Posts: 430
Joined: Sun Aug 18, 2013 11:20 am

Re: Highslide Box to open inside a WebGL Page??

Wed Jul 04, 2018 1:49 am

Destiny wrote:Hi... I could not quite work that last code out, so I will play with it more...
This is not complicated. Here's what you have now, from your post above:

Code: Select all

<a id="thumb1" href="./images/gallery1.jpg" class="highslide" onclick="return hs.expand(this)">
<img src="./images/gallery1.thumb.jpg" alt="Highslide JS"
title="Click to enlarge" />
</a>
Just wrap that in an invisible div:

Code: Select all

<div style="display:none;"><a id="thumb1" href="./images/gallery1.jpg" class="highslide" onclick="return hs.expand(this)">
<img src="./images/gallery1.thumb.jpg" alt="Highslide JS"
title="Click to enlarge" />
</a></div>
That really is all there is to it.
This is our project so far..
Wish I could help, but your site is infected with phishing malware, and is being blocked by my DNS provider (OpenDNS).

MisterNeutron
Posts: 430
Joined: Sun Aug 18, 2013 11:20 am

Re: Highslide Box to open inside a WebGL Page??

Wed Jul 04, 2018 1:59 am

BTW, OpenDNS is blocking all of members.westnet.com.au. The entire subdomain has been blacklisted for some reason.

Destiny
Posts: 69
Joined: Tue Sep 25, 2012 3:08 am
Location: Queensland Australia

Re: Highslide Box to open inside a WebGL Page??

Wed Jul 04, 2018 2:17 am

Oh eeks.. Well, can you try again... I was actually uploading it all again with the red X and colour changes.. That might have been the issue...

and..... your code works.. No more thumb images... I understand what you did.. Surprising enough.. :lol:

Destiny..
MisterNeutron wrote:BTW, OpenDNS is blocking all of members.westnet.com.au. The entire subdomain has been blacklisted for some reason.

MisterNeutron
Posts: 430
Joined: Sun Aug 18, 2013 11:20 am

Re: Highslide Box to open inside a WebGL Page??

Wed Jul 04, 2018 2:43 am

It's not the specific page that's at issue - the entire subdomain is being blocked. Here's what I get:
ss004221.png
ss004221.png (20.39 KiB) Viewed 430 times
I tried to report it as an incorrect block, with no luck - it won't even let me send a message on their reply form.

Destiny
Posts: 69
Joined: Tue Sep 25, 2012 3:08 am
Location: Queensland Australia

Re: Highslide Box to open inside a WebGL Page??

Wed Jul 04, 2018 8:51 am

Oh man... For some reason my password did not work so I went through the process fo proofing who I am.. PAINFUL..!! I have a new password sent to me but now I need to change it.. emmmmm....

Anyway.. I contacted my Westnet ISP and they said there is nothing wrong their end. It would seem that you would need to set the site to not spam via your OpenDNA options.. Not sure how you can do that.. Westnet said that sometimes this happens due to yuck people creating accounts and causing issues.. They said they try to delete suspicious users or content as soon as they are aware of it...

Well.. Real shame you cannot see you code working.. I need to fix it all anyway.. Lots of work to finish is but thanks to you we can now move on.. Its a resource for some of my ICT students.. Some kids cannot visualise 3D so I try to find way to assist them..

I will post up the final when its done in the hope you will be able to view it at some stage..

Destiny...
MisterNeutron wrote:It's not the specific page that's at issue - the entire subdomain is being blocked. Here's what I get:
ss004221.png
I tried to report it as an incorrect block, with no luck - it won't even let me send a message on their reply form.

MisterNeutron
Posts: 430
Joined: Sun Aug 18, 2013 11:20 am

Re: Highslide Box to open inside a WebGL Page??

Wed Jul 04, 2018 11:14 am

I got to your site by changing the DNS servers in my router (I can't "set" anything with OpenDNS - I simply have my router pointing to their DNS servers, since they're generally faster and more reliable than my own ISP's DNS servers). Got a look at your Highslide code, and did a quick cleanup.

The old examples were written in XHTML, which is dead, so I made the few changes to make it valid HTML5.

I pointed it to the highslide-full.js script - using the subsets, like highslide-with-gallery.js, produces failures if you inadvertently use some feature that's present only in the full script. It's a small script, so there's no reason to use a subset of it.

I straightened out some mismatched <div>'s, put the Javascript into a single <script> block, and did a little formatting to make it easier to maintain.

Attached as a zipped .txt file
Attachments
destiny.zip
(855 Bytes) Downloaded 16 times

Return to “Highslide JS Usage”