Skip to main content
Participant
October 5, 2017
Answered

Want to create simple rollover buttons and put them where I want...

  • October 5, 2017
  • 2 replies
  • 1262 views

So after watching a lot of youtube videos - many of which appear to be out of date (the person will often go to some menu or tab that my latest copy of Dreamweaver simply does not have!) - I am totally lost and wondering how I can do the following:

I have a background image, which is of a large TV basically, and I want the buttons to light up when you mouse over them, and click. Simple, I thought! Beginner stuff.

So far, I can put my image in the page, as a background, and I can also make the rollover button. The button appears above my background image however, and I can't move or drag it. BRILLIANT. (Sorry, I'm a bit upset that this isn't simpler to do and all the tutorials appear to be outdated)

How do I, after making the rollover button - move it to the desired location, over my background? Any help will be really appreciated! I'll be glad to watch any tutorials you know of that can help with this also.

This topic has been closed for replies.
Correct answer Jon Fritz

pyremind  wrote

I'm a designer that doesn't want anything to do with code.. haha.

You are looking for Adobe Muse then.

The interface will be immediately much more recognizable to you.

That's Adobe's "for designers who don't want to learn code" website development tool.

2 replies

Jon Fritz
Community Expert
Community Expert
October 5, 2017

According to Adobe, Dreamweaver is for "Designers who want to work with code". The program really does assume that you have a good grasp on html, css and some javascript. If you don't, it's going to be a very steep climb for you. Using out of date resource material is going to compound any issues that come up.


On an image I don't intend to be responsive, I would give the larger TV image's container the css setting of position:relative. Then place the buttons in that same container and give them the css setting of position:absolute. I would then drag them into their final positions from within Design View.

A word of caution, although you can use position:absolute here, it can be pretty tricky if your TV image is responsive and changes size based on browser window width. Absolute positioning by default uses a pixel value and that value won't change when the screen size does.

PyremindAuthor
Participant
October 5, 2017

Thanks - maybe this isn't the right program for me..? I'm a designer that doesn't want anything to do with code.. haha.

The containers gives me a new thing to look into so thankyou for that. If you have a program that might be more my speed, I'd be happy to hear about it!

The T.V. itself will be playing my portfolio reel when you click play - so I'm not sure whether absolute positioning would be wrong for this.

Jon Fritz
Community Expert
Jon FritzCommunity ExpertCorrect answer
Community Expert
October 5, 2017

pyremind  wrote

I'm a designer that doesn't want anything to do with code.. haha.

You are looking for Adobe Muse then.

The interface will be immediately much more recognizable to you.

That's Adobe's "for designers who don't want to learn code" website development tool.

PyremindAuthor
Participant
October 5, 2017

Also, I see a lot of mention of the 'common' category in the insert tab... that's another one that appears to have vanished?

PyremindAuthor
Participant
October 5, 2017

And "layout"... where did that go to?