highslide thumbnail viewer

[cbarr28]

heres the problem...

i have a map on my site that i use to show photos of different areas on the map. when you roll over the location a menu appears (running another javascript to achieve this). From this menu i link to the images of that area. I am running the highslide from these links but once a link is clicked the link stays visible. Fhe only way to make it go back to being hidden is to refresh my browser. Any ideas as to why this may be happening, and how should i approach fixing it? heres the html:

Code: Select all

<div id="kentmap">
<div id="stevensville" onmouseover="javascript:showObject('stevenshover');" onmouseout="javascript:hideObject('stevenshover')">
 <div id="stevenshover">
 <div id="stevenshoverhead"></div>
  <div class="linkbox">

<a href="images/photos_bank.jpg" class="highslide" onclick="return hs.expand(this, {captionId: 'caption1'})" >Stevensville Bank</a>
<div class='highslide-caption' id='caption1'>
    <p >Stevesville Bank</p> 
    <a  onclick="return hs.htmlExpand(this, { contentId: 'highslide-html' } )" 
		class="highslide"><img src="images/info.gif" border="none" /></a>
</div>
<div>
<div class="highslide-html-content" id="highslide-html" style="width: 400px;">
	<div style="height:40px; padding: 2px;">
	    <a href="#" onclick="return hs.close(this)" class="control"><img src="images/close.gif" alt="Close content window." title="Close" border="none" /></a>
	    <a href="#" onclick="return false" class="highslide-move control"><img src="images/move.gif" alt="Move content window." title="Move" border="none"/></a>
	</div>
	<div class="highslide-body" style="padding: 0 10px 10px 10px">
		<p>Stevensville sits on land called Stevens Adventure, a 1694 grant to Francis Stevens. The town developed after the 1850 sale of two farms by James and Charles Stevens, descendants of Francis Stevens. A tax map shows that by 1877 the town had grown to nearly 30 structures, including dwellings, churches, stores, a doctor &rsquo;s office, a post office, an Odd Fellows&rsquo; hall and a hotel.</p><p>Stevensville's development benefited from the steamboat-based trade system that linked the eastern and western shores in the mid-19th century.</p><p> The railroad came to Stevensville in 1902, and by 1909 the town had two school, four doctors, a blacksmith and a sawmill.The end of passenger rail service by 1938 and freight line service by 1948 halted growth of the town.</p><p> Today, Stevensville is still a close-knit community that retains its charming 1920s appearance. Its historic district was placed on the National Historic Register of Historic Places in 198.</p>
	</div>

</div>

</div>
</div>
   <div class="linkbox">
   <a href="images/stevens_post_thumb.jpg" class="highslide" onclick="return hs.expand(this, {captionId: 'caption2'})">Old Post Office</a>
   <div class='highslide-caption' id='caption2'>
    Old Post Office Info.
</div>
   </div>
   <div class="linkbox">
   <a href="images/stevens_church_thumb.jpg" class="highslide" onclick="return hs.expand(this, {captionId: 'caption3'})">Church</a>
   <div class='highslide-caption' id='caption3'>
    Church.
</div>
   </div>
   <div class="linkbox">
   <a href="images/stevens_kirwin_thumb.jpg" class="highslide" onclick="return hs.expand(this, {captionId: 'caption4'})">Kirwin house</a>
   <div class='highslide-caption' id='caption4'>
    Kirwin.
</div>
   </div>
   <div class="linkbox">
   <a href="images/stevens_cray_thumb.jpg" class="highslide" onclick="return hs.expand(this, {captionId: 'caption5'})">Cray House</a>
   <div class='highslide-caption' id='caption5'>
    Cray.
</div>
   </div>
   <div id="stevenshoverbottom"></div>
 </div>
</div>

<div id="kentpoint" onmouseover="javascript:showObject('pointhover');" onmouseout="javascript:hideObject('pointhover')">
 <div id="pointhover">
   <div class="linkbox">
    <a href="#" class="hoverlink">View Photos</a>   </div>
  </div>
</div>

<div id="chester" onmouseover="javascript:showObject('chesterhover');" onmouseout="javascript:hideObject('chesterhover')">
 <div id="chesterhover">
   <div class="linkbox">
    <a href="#" class="hoverlink">View Photos</a>  </div>
 </div>
</div>

<div id="lovepoint" onmouseover="javascript:showObject('lovehover');" onmouseout="javascript:hideObject('lovehover')">
  <div id="lovehover">
   <div class="linkbox" style="left:1px">
    <a href="#" class="hoverlink">View Photos</a>   </div>
  
  </div>
</div>

<div id="roman" onmouseover="javascript:showObject('romanhover');" onmouseout="javascript:hideObject('romanhover')">
  <div id="romanhover">
   <div class="linkbox">
    <a href="#" class="hoverlink">View Photos</a>   </div>
  </div>
</div>

<div id="narrows" onmouseover="javascript:showObject('narrowhover');" onmouseout="javascript:hideObject('narrowhover')">
 <div id="narrowhover">
  <div class="linkbox">
   <a href="#" class="hoverlink">View Photos</a>  </div>
 </div>
</div>

[/code]

[cbarr28]

heres a link to the web page, only one roll over looks/behaves the way it is designed too (the link in the center of the map, right above the pink line.) the other rollovers on the map havent been formated yet;

http://www.imoriginal.net/kent_test/map.html

[torstein.honsi]

It is probably because the visibility is set to visible when the highslide closes again. This is done internally, but you can fix it by first setting hs.hideThumbOnExpand = false, then modify highslide.js by commenting out line 1350:

Code: Select all

//this.thumb.style.visibility = 'visible';

From version 3.3 the expanded thumb will get a className change, so you will have full control from the CSS.

[cbarr28]

thanks. i changed the code 0n line 1350 of the JS

Code: Select all

 HsExpander.prototype.onEndClose = function () {
   this.thumb.style.visibility = 'hidden'; 

and its works, but now the links in the menu become hidden. check it out here. (middle rollover that is directly above the pink line):

http://www.imoriginal.net/kent_test/map.html

any other work arounds?[/code]

[alakhnor]

Here's what I've done: http://vikjavev.no/highslide/forum/view ... ight=#2785

[cbarr28]

thanks again for the help alakhnor!