Sent by Rafael Apocalypse on 4 January 2005 13:01
Hi folks,
this is my first message to the list, i'm a brazilan designer, my
name is Rafael Apocalypse, but you can call me Raf, it's more easyer.
Karl, you can try to put in your link like this : <a href="#"
onclick="your javascritp" ...
and in the css put a reference for a:visited with the especifications
for you visited links.
When somebody clicks in the image, the onclik event will start
the pop-ups and the visited link will work.
I hope that this help you.
raf
On Tue, 4 Jan 2005 12:50:19 -0000, Karl Bedingfield
[EMAIL-REMOVED]> wrote:
> Hi there and Happy New Year!
>
> I am currently working on a site design and the customer wants pop-ups to
> show larger versions of thumbnail images of his holiday property. I have
> decided to use JavaScript for this and all works well.
>
> For the thumbnails I am using a CSS scheme to pull in the thumbnails and
> change border when hovered over, again this works as intended but once the
> larger image has been closed (after the pop-up) the thumbnails not clicked
> reload when you hover over them. Now is there anyway to stop the thumbnails
> reloading every time after a pop-up has been clicked?
>
> Here is a link to an early test page that has the thumbnails mentioned
> above:
>
> http://www.bedingfield.org.uk/test/
>
> and this is the CSS I am using for those thumbnails:
>
> /* Gallery Image Styles
>
> ----------------------------------------------- */
>
> #images-container {
>
> /* text-align: center; */
>
> padding: 0;
>
> margin: 0 0 20px 0;
>
> }
>
> a.image, a.image:link, a.image:visited, a.image:active, a.image:hover {
>
> text-decoration:none;
>
> border-bottom:none;
>
> }
>
> #images-container ul {
>
> width: 400px;
>
> height: 75px;
>
> margin: 0;
>
> padding: 0;
>
> list-style: none;
>
> }
>
> #images-container ul li {
>
> float: left;
>
> display: block;
>
> width: 82px;
>
> height: 82px;
>
> margin: 6px 18px 16px 0;
>
> }
>
> /* Start For IE6 */
>
> /* \*/
>
> * html #images-container ul li {margin: 6px 2px 0 0;}
>
> /* */
>
> /* End For IE6 */
>
> #images-container ul li a {
>
> display: block;
>
> text-indent: -3000px;
>
> border-width: 0;
>
> width: 82px;
>
> height: 82px;
>
> margin:0 6px 0 0;
>
> padding:3px;
>
> border:2px solid #ccc;
>
> }
>
> #images-container ul li a:hover {border-color:#333;}
>
> /* Thumbs
>
> -------------------------------------------------------------------------*/
>
> #images-container li.dor a {background: url(../img/home/1t.jpg)
> no-repeat center;}
>
> #images-container li.por a {background: url(../img/home/2t.jpg)
> no-repeat center;}
>
> #images-container li.our a {background: url(../img/home/3t.jpg)
> no-repeat center;}
>
> #images-container li.sar a {background: url(../img/home/4t.jpg)
> no-repeat center;}
>
> #images-container li.dine a {background:
> url(../img/accommodation/dine_t.jpg) no-repeat center;}
>
> #images-container li.kitc a {background:
> url(../img/accommodation/break_t.jpg) no-repeat center;}
>
> #images-container li.bath a {background:
> url(../img/accommodation/br_t.jpg) no-repeat center;}
>
> #images-container li.swim a {background:
> url(../img/accommodation/sw_t.jpg) no-repeat center;}
>
> Any suggestions you have would be greatly welcomed.
>
> Many thanks
>
> Karl
>
> ______________________________________________________________________
> css-discuss [EMAIL-REMOVED]]
> http://www.css-discuss.org/mailman/listinfo/css-d
> List wiki/FAQ -- http://css-discuss.incutio.com/
> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
>
--
Rafael Apocalypse
+55 31 3446.2555
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
