I have an ImageWell and have added a mouse Enter and Exit event to change the image when the mouse hovers over the image. Whilst the logic works the problem is that the events are being sent back to the server whereas I want to make the events take effect at the client side. I cant find anything in the docs or on this forum on how to add client side events to controls. Is this possible? If not has anyone created a Super or a plugin where you can specify a normal image and a mouse enter image that creates the javascript on the client side?
I tried for days to get a “Hover” to work like that. No glory.
The Built in imagewell change on roll over is simply too slow.
You might try putting two images there and toggling the visible property on and off . But I think that approach also requires the image to come from the server.
Perhaps you can put the image way off the screen like at X 120000 and “pop” the image into place by moving it back onto the screen.
I can easily add this to Web Custom Control’s WebImageViewTD and will do so for the upcoming release.
This is something that should really be handled using CSS.
Lookup CSS and “hover” . You just assign a different image for the background of the element and the browser will handle it itself.
Steve, I know it is just CSS but how do you find out the CSS that is associated with the control? My style is called “styToolbarButton” and where do you place the CSS that you want to include - is this in the HTML Header part?
Daniel, I really like your controls and it would be great if you could add this. The reason why I dont currently use them (I want to) is that I cant get my head around how I link the pictures that I have embed within Xojo to work as URLs with your plugin. It would be great if you could reference the Xojo embed images directly within your plugin in some way.
Also the it would be good if you could reference the embeded images with your preloader plugin because again I am not using it for the same reason as above.
Sorry, I’m a RB/Xojo head and a web/CSS head, but not yet a Xojo WE head.
I’d do what I normally do and use either FireFox with FireBug installed or Safari, right-click the element in the browser, select “Inspect Element” and then do a bit of detective work.
Either that or wait for the update to WebCustomControls…
Steve, yeah I thought that but I think Xojo creates the styles dynamically so I dont think it is that easy. I’m sure one of the gurus on the forum must have a way of doing this otherwise we are all tied to what Xojo allow us to do which means we cant add our own client side stuff.
I believe (haven’t looked at it in a long time) that when you assign a style to a control, that becomes a class name for the control, so you should be able to add CSS to the header of the page and use the style name as a class selector. But I could be way off base.
I’d love to know about that too.
I appreciate the wizardry of Xojo WE (having done it by hand, I really do) but I also hope to see it take advantage of client-side capabilities over time.
CSS animations and even simple things like roll-overs should really be handled client-side yet made available to the Xojo coder. Then we’d really be firing on all cylinders!
Tim, just checked and you are correct, not sure why I thought it was dynamic.
WebImageViewTD.Picture lets you assign a picture, either from your project or created at runtime.
WebImageLoaderTD.LoadPicture wants a URL, so create and store a WebPicture object and use its URL.
myPage.myIcon = New WebPicture(someImageInMyProject)
myImageLoader.LoadPicture(myPage.myIcon.URL)Ah, I didnt realise that the URL was readable, thanks I will have a play with that. If you could add the client side rollover bit that would be great, any idea when you might be able to add it 
[quote=75528:@Steve Upton]This is something that should really be handled using CSS.
Lookup CSS and “hover” . You just assign a different image for the background of the element and the browser will handle it itself.[/quote]
I don’t believe the CSS hover trick works if the src attribute is set. An empty image well still has its src set to a spacer.gif image. At least that’s what I’m running into trying to use the styling tools in Web Custom Controls.
A possible work around would be to use an empty WebContainer instead of an image well.
For WebImageViewTD I’m going to use JavaScript and let users attach images to more events then just hover.
The next release has some large controls in it and is still a good week or two off. But…this feature should be easy to add to WebImageViewTD, so in a couple days I could provide you with a beta of just that control.
You are correct, I was thinking it would have to be done using JS. The messy way would be to have a generic JS that removes the source from your control and then use CSS to do the hover bit but personally I would prefer to be able to have more events as you suggest.
A beta would be great, also interested to know what else these large controls are???
[quote=75564:@Daniel Taylor]WebImageViewTD.Picture lets you assign a picture, either from your project or created at runtime.
WebImageLoaderTD.LoadPicture wants a URL, so create and store a WebPicture object and use its URL.[/quote]
I should add the following: if you create a WebPicture and preload the URL, use the same URL with WebImageViewTD. If you assign the picture directly under the hood a new WebPicture will be created with its own URL. The browser will think it’s a different image and re-download it.
You’ll just have to wait and see 
Happy to beta test anything for you
Just a side note: if you are using mouse enter and exit then be aware of the following bug reported in Dec 2011:
To support retina images and also works with image rollovers, I assign a webstyle to an empty imageview. In the app htmlheader, I put css styling with a style class the same name as my webstyle. In this css class, I assign background image properties.