HELP: Photoshop Button Hover Rollover State Flickers (jumps) Upon First Preview

All photoshop buttons flicker (jump abruptly) before the rollover state is displayed in preview mode and in browser for the 1st time. After that the behavior is normal. The rollover and hover image displays without a flicker. Why all the graphics not preloaded to prevent this mega-annoying issue? Is there a work around?
I tried INSERT HTML option as an alternative to photoshop buttons using the following code, since it works flawlessly on other web building programs, but it doesn't even work in Adobe Muse. I am stock and don't know how to work around this issue.
<a href='Destination URL' target="_top" onmouseover="document.sub_but.src='http://yourdomain.com/onroll.jpg'" onmouseout="document.sub_but.src='http://yourdomain.com/normal.jpg'">
<img src="http://yourdomain.com/normal.jpg" width="281" height="55" border="0" alt="Move your mouse over me" name="sub_but">
</a>
I love the convenience of photoshop button but the results are truely unprofessional on first loading. Any help or suggestion is greatly appreciated.

Do you have a URL to a site using Photoshop buttons placed in Muse? My guess is that the images are very large and taking some time to load initially.
Colby

Similar Messages

Photoshop Button in Active State Returns to Normal After Rollover?

Hello,
I'm working on a glossary reference website in Muse, and have hit a roadblock with my photoshop buttons.
I have created menu buttons in Photoshop that have two different states - one for active and rollover, and another for normal and down (the button is actually saved with four different layers/states, one for each, but for what the user will see, it's really only two options). I've used these menu buttons as rollover triggers for blank compositions, and when the user rolls over the button, the name of the page appears below it, and then disappears on rollout (otherwise the names would overlap and it would look very cluttered).
The issue that I have found is that, when I preview the page in my browser, the buttons appear to function properly in that they show up in the active state indicating that the page that they are linked to is the one that they are on.
Initial View - Home Page:
...and when I rollover the image of the page that I am currently on, the button shows the name of the page as desired, like so:
However, when I rollout, the button reverts back to the normal/down state, even though I am still on the home page.
Below is a screenshot of the composition settings that I have set up for this widget. I tried switching the "Hide Target" to none, but since the target is referring to the word "Home", the word "Home" remained visible in addition to the button remaining in the active state, which is not what I want. I also tried selecting "Triggers on Top", but the issue was not solved here either.
What am I missing? How can I make sure that my button remains in the active state when on the page that it is linked to?
Thanks for your help!
Rachel

Sounds like a bug that's the fallout of the overloaded meaning of "Active" state. "Active" is both the state used for an item with a hyperlink applied that points to the current page (or an anchor point in the current scroll range on the current page) and the state used for a trigger or thumbnail in a Composition or Slideshow widget that corresponds to the a current active item in the composition or slideshow.
It appears we honor the hyperlink definition of "Active" on page load for a composition trigger with a hyperlink to the current page applied, but don't honor that definition of active when transition to having no items in the composition active (or presumable when transition to having a different item in the composition active).
The only workaround that comes to mind would be the very tedious approach of replicating this composition widget on each page, removing the hyperlink on the "active" trigger and manually formatting it's "Normal" state to appear active.
I've written up the bug. However, it may not get fixed immediately. (We tend to collect smaller fixes in an area and then address them all at once or when other changes are planned in that area, due to the overhead involved in ramping up to work on an area and thoroughly retest it after changes.)

Scaling a button with rollover state (IDCS3)

If you have a button with a rollover state and then scale it, only the currently visible state is scaled.
Would you guys consider this a bug or intentional?
Any hints on how I can scale all states without laboriously editing the content of every button state?
Cheers, Graham.

Graham,
Nice follow up on this, but watch out!
When you change that preference to "Adjust Scaling Percentage" anytime you scale text frames, you will create a situation where the point size changes but is displayed with the parenthetical amount.
For instance, if you scale 12 point text down 50%, the point size for text will be displayed as 12(6)pt.
Then if you want to change the text to 8 point, you would have to type in 16 points.
Obviously with this simple example the numbers are easy to figure out, but with other amounts it can get very complicated.

Photoshop button not working inside of target?

I'm operating OSX Snow Leopard and the latest edition of Muse 2.2. However, I was having these issues with the version before 2.2 as well.
I created a simple photoshop file containing 2 states Normal and Over. When I place as photoshop button outside of the target it functions properly. When I place within the target it does not. Any suggestions? I'm using the tooltip composition widget.
Thanks!

It does not depend on the version of Photoshop. It will be same for all the versions.
I understand what you are trying to explain. I would like to tell you that it works outside the trigger because when it is outside the rigger it is not in active state.
However, when you take it inside a trigger, whenever the trigger is selected, it comes to active state. And "Whenever a link/button is in active/visted state, other states do not work on it".
And as you said you only have two states i.e Normal and Rollover, when you insert such photoshop buttons into Muse it automatically copies the normal state settings to Active state and the rollover state settings to mouse down state.
Please have a look at the screenshots
When I insert a button with only two states :
It copies the states to mouse down and active as well :
Now, please try and insert the photoshop button in the second trigger instead of first trigger of the widget. Wthout clicking on it, just check if the color of the button inside the second trigger changes or not on hovering the mouse over it. It ideally should.
But once you click on the second trigger, it will make it active (Whose colour is same as the normal state in your case) and all other states will stop working.
Now, please look at the video through the link which I posted in my last comment.
Hope this explains the situation.
Regards,
Sachin

When hovering over button text it does not show button rollover state

Hi
I'm new to captivate and I'm looking for some help please. I have created buttons with Adobe Flash and saved them in PNG format, I have created an upState, overState and downState. These are working really well when I use them in Captivate. However when I add text to my buttons and rollover the text the buttons don't change state. They only change state when I hover over the button itself (a bit without the text).
Any help you can give me would be greatly appreciated.
thanks

No, if you cover up with text, and user clicks on text, the rollover state will not function.
I have another work flow for translation (have tutorials in several languages as well). In previous versions I used Photoshop to create buttons, using layers and having the Text layer separately, so that to translate I only needed to change that layer. But I created the regular Captivate buttons (needing three PNG's for 3 states).
In Captivate 6 I have almost replaced all butons by Smart Shapes used as button. Since the double as text containers, translating is now done in Captivate itself. But those shape buttons do not have a rollover functionality, can cope with that, I opt to show the hand cursor.
Really, cannot help you if you want to stick with Flash buttons that have to be layered under a text caption, unless you make the flash button transparent where the Text has to go, so that you can put the text under the Flash button.
Lilybiri

How do I import a Photoshop button (including it's different states) into the muse menu widget?

I had the idea of using the "place Photoshop button" option to configure the states in my horizontal menu bar in Muse. I started out trying to use the widget, after playing with the options it seems I can either load each individual state one at a time in manual mode or I can try to make a menu bar from the buttons and manually place the respective links. I would be grateful for a suggestion or alternative method that is as easy as the "place Photoshop button" option, I love that feature. Thanks in advance.
J
UPDATE: I found that I could use Fill image then in import fill options, import layer + clip layer contents for each of the states. It was working very well but I noticed an error in one of my buttons states so I had to go back to Photoshop. When I returned to start this process again and I clicked import layer, the states are all flat plain text without any of the blending options I had set for each state. The odd part is that I can see all the layers in composite, but it will not let me place each layer as it did before.
After several frustrating hours going through every step I edited and even trying to load the buttons I thought were exactly the same file I used before I could not find what I had done differently to cause this. I did successfully place each Photoshop button in empty space and the cut and paste them into the menu. Which is way easier then the original method. I would like to know if anyone has an idea what went wrong for the sake of knowledge. Also thought that this cut paste method might help others trying to build menu buttons outside of Muse.

I'm afraid Photoshop is a graphics program ill suited for generating good HTML and CSS code. Use Photoshop to create your images only. Use DW to build your HTML, CSS and menus.
Have a look at this tutorial:
Taking a Fireworks (or Photoshop) comp to a CSS based layout in DW
Part 1 --
http://www.adobe.com/devnet/fireworks/articles/web_standards_layouts_pt1.html
Part 2 --
http://www.adobe.com/devnet/fireworks/articles/web_standards_layouts_pt2.html
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
http://alt-web.com/
http://twitter.com/altweb
http://alt-web.blogspot.com

PSD Rollover Button with image in front stops button from changing state

I have a wide PSD button that changes state when rolled over. I would like to place a PNG image with transparency in some areas over the top of it so that the rollover button shows through the transparent areas of the PNG.
How can you get it to do the rollover effect when the user mouses over the bit of the button that the image is in front of? Is ther a way of making the PNG 'invisible' to the mouse?
I know I could redesign the button so that it includes the image but I'm trying to keep file sizes and load times to a minimum, I use this button a lot on my website with a different on each, and having that number of individual buttons would result in a bloated, slow-loading website.

Hi Abhishek
Thanks for your reply. I was able to achieve the effect I wanted by having the PNG and the PSD Button with the same link and then grouping them. This means I can mouse over the PNG and still get the PSD rollover effect, which is perfect.
However I also have another similar problem. I have some different PSD Rollover Buttons which have some text in front of them (basically it's the button label). On some of these buttons when you roll over the text it prevents the rollover state of the button, and on other buttons the rollover effect occurs as it should, and there doesn't appear to be any consistency about which does what. Grouping or ungrouping doesn't appear to make a difference. Can you help?

I want to use a customized photoshop button with my composition and have rollover effect

I'm trying to place a photoshop button into a blank composition widget trigger. When I cut a paste the image into the trigger it looses its fuctionality and no longer switches colors during rollover. It works fine in the lightbox composition, but the problem with lightbox composition is that it does not have rollover options to display the target only click. How do I get around this problem. I want to have my own customized button with the composition effect within muse cc.

You should check the design layout and states defined for the trigger , if the state is defined properly then it should show the rollover state, but the target container corresponding to the trigger is on the page then it would show you the active state not the rollover state.
Thanks,
Sanjit

Link to frame in button rollover state not working..

Hi guys,
What I use: Flash CS5 & Actionscript 3
So I had my buttons working just fine and linking to a frame. But after adding a rollover state in which my button has grown in size it no longer links.
Does anyone know how to get my buttons linking in their rollover state?

var someObject:MovieClip; // this is declared - only
var someObjectMovieClip = new MovieClip(); // this is declared and instantiated
Make sure your code uses aghains and not instancename like your code shows.
I don't think you understand the third and fifth items I listed either. The third is saying that the code is not in the same frame as the item it is trying to target. The fifth has to do with objects in consecutive frames, not linking.
If you followed what I mentioned in the last sentence you should have a line number indicated in the error message that will tell you which line is causing the problem. Whatever line that is, the object doesn't exist as far as the code sees it. So if it was the line...
instancename.addEventListener(MouseEvent.CLICK, fl_ClickToGoToAndStopAtFrame_28);
I can guarantee you that there is no object named instancename in the frame where you have that code since it is the only object targeted in that line of code.

Photoshop button links- help!

I created several different photoshop buttons that link to different pages in my website. I had never had an issue with them until I started moving the physical location of the buttons around on the page. In preview mode, all links work perfectly. However when I publish my work, the buttons are linked to all the wrong pages (they usually link to the page that used to be in that physical location).
However I've double checked and they are all linked properly. I have no idea what is wrong.
Here is my site. if you click on the buttons in the bottom row you will see what I mean.
http://www.maddienieman.com/
Please help me,
MN

clear your cache. they all work for me

¿Custom button with different size/shape for rollover state in Muse?

Hello, i'm trying to make a custom button, that has one size/shape when normal, and other size/shape when rollover.
The problem is that the area not visible in normal state is a hot area, so when then mouse rollover anywhere near, activates the button rollover state.
So i think what i need is mask or something like that
Is there a work around to do this? Is even possible in normal CSS - HTML5?
Here is the website:
http://www.audime.com/prueba/
And here what i'm talking about:
Thanks in advance!

I'm not fully understanding the screenshot, but what you're describing sounds more like a Composition:Tooltip widget than a button.

Syncing Button Rollover States

I'm building a website for myself (currently with the Muse trial, but I am planning to buy), and I have a question regarding button rollover states. The site I'm building is an architectural photography website, and the general portfolio page has a list of subcategories in the left-side menu bar. However, I also want to have thumbnail links to each of the subcategories in the main body of the website (see image provided). The thumbnails are for the Educational and Municipal subcategories. I have currently set up the rollover states for all the links in the left-side menu (to turn to the light blue that is seen on the active state of the Portfolio button), and I've set the rollover states for the thumbnails (to go to 50% opacity). Is there a way for me to synchronize these rollover states? I would like to see a thumbnail respond in its rollover state if I roll over its corresponding button in the left-side menu, and vice versa.
Thanks!
Rob

Hi,
To accomplish that you can use the composition tool tip. A transparent triger can be placed where your menu item is and the target will be on the image with an opacity of the 50%.
However, this will only work in one direction and will not change the menu item when you roll over to the image.
Regards,

Help with buttons within buttons

I am trying to get stop and play buttons for the background
music of my site to work within an animated rollover state of a
separate button. When I put the stop and play buttons into the
rollover animation they effect the hit state of the button they are
inside, how do I get around this? If you look at
www.thepixelplaypen.com/site you will see the menu bar at the
bottom. If you click on the references button (the 3d thought
bubble) i have directed it to how I want the page to look and work
when the music bar is 'rolled over'.

I've look at the site but am not sure what you mean. 1st I
don't know what the music bar is. Are you talking about the menu
bar when it's blank and minimized? Because when I go over that it
jumps from expanding to its full form to back to its minimized
state over and over.
I think what you need is something a little more involved
than the over/out states buttons give you.
I would say a two state movie clip with a variable that flags
on and off for the menu. Have the "toggle" turn off when moved out
from the menu, but not when over the music switch. For example, a 2
second delay that tests for the toggle being off, and the music
button turns it on on over...
Hope that helps...

Can a Photoshop button be used as a Lightbox trigger?

I've brought in a layered PSD file as a button with different states, but instead of the button linking to another page or similar, I'd like it to trigger a lightbox image that triggers a different hero image. Or, thinking about it in another way, can a lightbox thumbnail be replaced with not only a different image than the hero, but also has normal, rollover and down states?
Is this possible?

Hello,
You can achieve this by using the Lighbox widget under "Compositions" option in widget.
First indert the Lighbox widget (from Compositions catagory in Widgets)
To insert the Photoshop button, Go to File>Place Photoshot button.
Select the PSD file and place it on the page.
Now click on the Photoshop button on the page and drag and drop it inside the Trigger of the Widget (Make sure the mouse pointer is inside the trigger and then release the mouse click to make sure it gets placed inside the trigger).
And you can add a different image/content for target container as well.
One quick tip : Click on "Hide all initially" option in Lightox widget properties (Which comes up when you click on small white arrow in blue circle when any Widget item is selected) to make sure all the states/layers of the button works.
Hope this helps.
Regards,
Sachin

Photoshop button editing

I had a photoshop button that just showed a new layer when you rollover. I added a new layer and made a few adjustments to the original image and went back into Muse, but can't find a way to edit the rollover states AFTER editing in photoshop. I go to the regular states window, but there's no way to choose which layers to show. I would have to import the button again, choose my state options, and relink all my hyperlinks. Am I missing something?

You can go to the Assets panel where you can right-click and relink the image for the changed state with the updated PSD file. Upon relinking, you will be prompted to choose the layer you want to link to where you can specify the layer you want to specify.
Hope this helps.
Cheers,
Vikas

HELP: Photoshop Button Hover Rollover State Flickers (jumps) Upon First Preview

Similar Messages

Maybe you are looking for