Hi, mechanics, this is my very first post. I'm using SS for a month or two now, and it's a wonderful tool, thanks!

These days for the first time I encounter a problem with an onmouseover effect that I use. Here is the situation: there is a grid with small images - 10x10 px blocks. A small image occupies one block and I set the FX: when you hover the pointer over the small image - a big one (100x100 px) appears next to it. And also there is a link assigned for one of the small images. I uploaded a test site here: Click to see the situation

Now the odd thing: When the mouse pointer comes close to the boy's small pic from the bottom upwards - the boy's big pic appears before the pointer has reached his small pic - pointer is still hovering over the girl's small pic and both big images are visible together - which is not my goal...

This problem disappears if a remove the link for the boy's small pic. The problem also disappears with some normal browser - Firefox, Opera. It's actually only existing with IE

I viewed your test page with IE8 and it works perfectly.

I took it very slow up, down, left and right, then moving from image to image up and down. Everything worked as it should, including the link on the boy.

Have you taken down the test site? All I see is a holding page for ihostvm.

I used the zoom feature of Firefox and it looks like the two images overlap slightly.

Your thumbnails are 10x10, but it also looks like your grid is 10x10. This means that your 10x10 thumbnails will lie on top on the grid borders instead of inside the grid, possibly overlapping. The inside of your grid cells should be 10x10 with a 1 or 2 pixel border around the cell. This would allow each thumbnail to be placed inside a grid cell with a border clearly separating each image and thus giving the mouseover effect some buffer space between each image.

g-u-l, I think you can get to the site by clicking the "Visit Your Trial Site" button on the left side of the page.

I believe larryd is right.

In Firefox: Both images pop-up when moving from bottom to top but the second image only appears as I get close to the top of the bottom picture, at that time both images appear.

Thank you, postyr, Geek-u-like, larryd and dirt racer!

The grid cells inside are 8x8 and with the 1px border around them the cells become 10x10. I intensionally made it this way to make sure that a thumbnail lies between 4 red marks and both thumbnails are exactly where they should be - the grid is actually another imported image file - it is made without SS.

My idea is that each thumbnail lies next to the other one - the goal is creating a mosaic with no empty spaces, borders, gaps... Larryd, you say buffer space - does it mean I can't make it my way, without empty pixels between them?

There is really a little overlap in Firefox and Opera, but its just OK, my big trouble is - 65% of the people use IE. Postyr says IE8 displays it fine, and here comes part two: only 30% of the IE users use IE8, and 70% use IE7 and IE6, according to Wikipedia published sept. 2009 research. Which means half of all people will see it the wrong way! So basically it's a IE7 and lower issue. Ideas?

Maybe you could solve the whole problem by using a table instead of a grid image.

Set the table border width and color as you want.

I would design my cells with a buffer between the images so that the mouseover effects are not interfering with each other. If this is happening with 2 images, what will happen when you fill the grid? You run into the possibility of having 4 images pop-up when the mouse hits a corner intersection.

Not shure but this might have to do with a bug that causes
invisible areas around objects that are smaller then a certain size ,
the critical size was near 10 px and lower.(if i remember well),
i also remember that it was browser dependent.

I solved that (back then)by making the problem object larger (12 px or so)
if it could'nt be optically larger then i made it larger by adding some background to it (using a grapics-prog)
so it would still appear small but was actually larger..translated to this ..it might just solve it when you add the
black borders + the 4 red dots to each picture...in case of overlap try just 2 sides (north + east for example)


It also depends on if you intend to fill up the whole chessboard with tiny pics ? or just these 2 ?

Try also various rendering settings.

Or instead of the simple mouse-over you could try the Special-effects > Mouse-effects
that has more settings...and sometimes cures problems even if you make it do the same.

Or you could instead of using the small image as a trigger...use a invisible trigger on top of that small image
since you dont see that you could adjust its form/size (by trail and error)
until you get the exact wanted trigger area...a little bit of a unscientific solution but it might do the job.
The invisible trigger area you make with a square/rectangle and set it to full transparent and no border (render it as gif)
Then you repeat that over each thumbnail.

Let me know if any helped...i guess at least the last (unscientific) way should do it.


Radio

It's not only IE7 issue. I use IE8 and am sorry to tell you that the problem is there .

Thank you all, I'll try and see if I get it to work properly on IE.

I think even the first site of this type has similar issues when zooming with IE. With larger images popping up as I want - mess gets even worse. But anyway borders should not be visible...

I'll play some more and tell you about the results.

Oops! After a few hours of trying everything said above^^ I just came to see that the problem was also existing in Opera but I didn't see it before. If IE triggers the link one square below the right place, Opera trigers it one square above it! ONLY FF triggers pop-up and link all properly !

I had some small success but never a full one, after trying invisible trigger images, 12x12 objects, different images for link and mouseover, space between thumbnails and so on...

But I don't give up this easy, now I start everything from zero - with one red square, no grid and no mouseover...

OK. Now I created it the most sipmple way I could think of. As you will see IE, FF, Opera - all cannot display it the right way. Again - IE is the worst.
We have only one 15x15!!! thumbnail, one link and a big red square to pop up! No grid! And still not working...In IE the big red one pops up about 2 or 3 px before the pointer reaches the thumbnail moving from the bottom upwards.

Hi again Marino.

I’m not quite sure how you have set the thumbnails size, but if you check the source code of your test page (obj31, line 40), you will see that the image is set as “width:15px;height:16px;"

If you are setting the object’s size directly with the Geometry Editor, maybe SS is making some adjustment upon publishing, which it shouldn’t do.

This test is not the same as using pre-built images of a desired size. You're kind of mixing apples and oranges.

Turning off Re-render and Anti-alias should result in a 15x15 pixel object, but this lets CSS color the background. As no image is generated, it is not really the same as using images.

I think i solved your puzzle.

check my examples:

HERE

So in this example (when viewed in IE7)
adding a link causes the cursor-arrow
to change into a cursor-hand.
Obviously slightly size/graphic differences
between a cursor-hand and a cursor-arrow
cause the perceived trigger-area to slightly shift..which causes the overlap.

Solution
--------

Avoid the cursor to change into something else..by either:


1) Not having a link inside the trigger-object.

or

2) Add a script or instruction that will always keep the cursor as a arrow (or a hand)


I'm shure Larry can come up with that in under 1 minute.


This might also explain browser differences since different browsers might
have slight differences in how they generate/position cursor-symbols.


Radio

.

Another solution is to place a (one large) invisible object over all
trigger-objects (small pics) and give it a (non-functional) link.

Like that the cursor-style will not change when hovering from one to the next small trigger-object.
but will still show a changing cursor (from arrow to hand) when you enter your larger chessboard-area
just in case you like that change-effect.

Many variations possible.

Again Larry may know how to create a link that dont really link.


EDIT:

In addition if you add some script that will make a cursor style fixed to solve this problem...
but dont want that fixed-cursor-style for the rest of your page
then you put your chessboard in a iframe so the cursor bahaviour will only act like that inside the frame.



Radio

To postyr: Yes, I used the geometry editor to set a 15x15 size... Probably it's my fault with the rendering options.

To larryd: You're right, I was wrong for that test - I did it just to compare how different browsers treat the cursor getting in touch with links.

To radio: Thanks for the time you've spent helping me with this example page, I'll try everything you wrote soon as I can and then I'll write back here... I definitely need both links+onmousever for each thumbnail. The website I'm working on is kind of pixel advertising, but not exactly. The official start is tomorrow - I'll post a link after publishing the press release...

Hi again, sorry for being away for a while.
The website officially took off - see it here. To see the "hidden" menu - click the "more"-button on the right. Any feedback is precious to me.
I almost got the mouse Fx to work fine (in a not-published test project) but didn't upload the new version yet.
There is still some little mess when adding links to the thumbnails but its better now. I think if I get a script or instruction that will always keep the cursor as a arrow - then this would be the end of my pain. Radio, you said Larry can help me?

Congrats on going live.

First rule, don't make them think.

I had to work quite hard to find out the terms of the offer, I would make it really clear what the offer is and how to take part.

I'd also check out some of the wording:
OK, you have already realized that you need your peace of this 100%,...
peace should be I think piece as in part, portion.

IMHO The menu item 'Take place' should be 'Take part'

When you mention the price, is it Dollars US, Canadian, NZ, Australian? you don't specify, I think it could be important as the value of each dollar in relative terms is different.

From a marketing perspective, I would concentrate on presenting the features and benefits of the service right up front and in far fewer more action oriented words.

I also think the offer is too expensive, a minimum of $100 is to my mind way outside impulse purchase territory which this offer is. However, if you said for example 'Only $0.01 per pixel per year', now that's cheap! Same deal, just dressed differently.

As you're entering into a contract for an extensive time, you also need seriously to think about what happens after you depart this earth. As you're now 25 years old, you're probably going to live another 60 or so years (longer I hope) what will happen to this site when you pass on? What happens if the internet as we know it today ceases to exist which is almost guaranteed, you still have outstanding contractural obligations with a financial implication.

Irrespective of this, the very best of luck to your innovative venture.