Roll over image and change text

User 2753649 Photo


Registered User
5 posts

Hi, I am using your free trial for Visual site designer to see if I like it.

There are two things I cannot find on this software:

1. Create a roll over image, there are the buttonize and mouseover functions but these functions I can't get it so that a new image appear when the mouse is moved over the original image.

2. Text, I cannot choose another font apart of the pre-set Arial font. Can't I choose another font with this software?

James
User 103173 Photo


VP of Software Development
0 posts

1. Create a roll over image, there are the buttonize and mouseover functions but these functions I can't get it so that a new image appear when the mouse is moved over the original image.

What exactly are you trying to accomplish that the mouse-over feature doesn't do?

2. Text, I cannot choose another font apart of the pre-set Arial font. Can't I choose another font with this software?

You can only use the fonts that come with the software. You should be sticking with Web Safe fonts.

http://www.coffeecup.com/help/articles/ … safe-font/
Learn the essentials with these quick tips for Responsive Site Designer, Responsive Email Designer, Foundation Framer, and the new Bootstrap Builder. You'll be making awesome, code-free responsive websites and newsletters like a boss.
User 2753649 Photo


Registered User
5 posts

Hi Scott,

I have worked out how to change font now so that problem is solved.

The mouse over problem, I would like one image to show and when the mouse pointer goes over I would like another image to show. I read that the mouse over function should be able to do this if the images are exactly the same size and that I choose "original object" for the first image and "mouseover object" for the mouse over image. However, when I try to preview the website, I get an error message. Please view screenshot attached.

Thanks

James
Attachments:
User 2088758 Photo


Senior Advisor
3,121 posts

Here is how I do it James,

remember to switch out the image path and name with yours.

<img src="images/learnmore.png" onmouseover="this.src='images/learnmorehover.png'" onmouseout="this.src='images/learnmore.png'">
Taking over the world one website at a time!

Steve Kolish
www.misterwebguy.com

YouTube Channel:
https://www.youtube.com/channel/UCL8qVv … ttneYaMSJA
User 2753649 Photo


Registered User
5 posts

Steve wrote:
Here is how I do it James,

remember to switch out the image path and name with yours.

<img src="images/learnmore.png" onmouseover="this.src='images/learnmorehover.png'" onmouseout="this.src='images/learnmore.png'">


Hi Steve, thats a bit too technical for me. Is there not a simpler way?
User 2147626 Photo


Ambassador
2,958 posts

Hey Jamesboo7, that error usually occurs when your mouseover object is to close to another object. Such as a text block or some other object on the page. Or your mouseover items are not the same size. Double check your sizes, then see if you have a text block or another mouseover item to close. Just something to check for . . .
Graphics for the web, email, blogs and more!
-------------------------------------
https://sadduck.com

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.