I'm fairly new to BSS and web dev in general but I've done some iPhone game dev a few years ago so I'm not a total newb.
I'm trying to implement a little feature: mouseover the logo (in the header) so it changes to a different logo image. (Silly I know but that's what customer wants). Seems easy enough. Simplest way seems to be a little custom code with a little javascript. I want to try javascript in an external file because this is going to be useful in future.
After a lot of wrangling I added two onmouse statements to existing BSS HTML code as follows:
and come up with the following Javascript:
function logoA(owner){
owner.src = "TSLogoA.jpg";
}
function logoB(owner){
owner.src = "TSLogoB.jpg";
}
which resides in a file that I have included in the Javascript section on the BSS Design panel.
BSS hides (filters?) my onmouse statements in the HTML panel but it's there in the custom code (OK). The logo images otherwise load and display as expected. I export and load the web site into Chrome but (sadly) no mouse over. Using Chrome's developer feature I examine the source. I can see the javascript file loads and there are no errors reported. But my onmouse statements statements are absent from the HTML code which seems to explain why my custom code does nothing. Why would my custom code NOT be included? I must be missing something? Hoping some clever dude can point me towards the light.
Forgot to put my code inside markers so here it is again:
<img src="TSLogo3.jpg" />
Loaded code manually and found my code doesn't work right so there's obviously a problem there. Hey ho
Sheesh, code sample from onmouseover is deleted again. Even this forum doesn't play nice with mouse events? "onmouseover" and "onmouseout" are HTML DOM mouse events. What up?
BSS developer choice not to allow on*, but I see you already found a workaround.
I wasn't quite there at my last comment marrco, but after a rewrite - success. The onmouseover and onmouseout work in custom code with an external javascript file.
onmouseover="changeImage('logo','assets/img/TSLogo4.jpg')" onmouseout="changeImage('logo','assets/img/TSLogo3.jpg')" So now hovering over the logo causes the logo to change and revert when cursor is moved away.
Awesome. The BSS custom code feature looks the goods for those special features.