image already big when page opens

Question

image already big when page opens

156 Views Asked by user2606934 At 22 July 2013 at 13:09

I really have been looking through formum but maybe I was not able to search for the right thing. I just want one of the images on page already opened after the page is loaded. I would like use it to generate special hints in webpage, that can be closed. I think it would be nice to use highslide and not use another script on page. Are there any hints ? Thank you

Original Q&A

There are 1 best solutions below

**MisterNeutron** · Accepted Answer · 2013-07-22T14:50:01.093000

Here's the simplest way to open an image on the page as soon as the page is loaded. The thumbnail and Highslide markup (the "a href" lines) don't even have to be on the page, though my example shows them - the event listener will work even without them:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Highslide JS</title>
<script type="text/javascript" src="highslide-full.min.js"></script>
<link rel="stylesheet" href="highslide.css">
<script type="text/javascript">
    hs.graphicsDir = 'graphics/';
    hs.outlineType = 'rounded-white';
    hs.addEventListener(window, "load", function() {
        hs.expand(null, {src: 'full-image.jpg'});
    });
</script>
</head>
<body>
<div>
<a href="full-image.jpg" class="highslide" onclick="return hs.expand(this)">
    <img src="thumbnail.jpg" alt="Highslide JS" title="Click to enlarge" height="120" width="107">
</a>
<div class="highslide-caption">
    This caption can be styled using CSS.
</div>
</div>
</body>
</html>

Be aware that you must use highslide-full.js or highslide-full.min.js for this to work.

image already big when page opens

There are 1 best solutions below

Related Questions in HIGHSLIDE

Trending Questions

Popular # Hahtags

Popular Questions