Skip to main content
Participant
May 18, 2018
Answered

Button pixelation on HTML5 non-responsive

  • May 18, 2018
  • 2 replies
  • 274 views

I am using Adobe captivate 2017.

I have various image butons in a presentation, and when i preview them in HTML5 they are pixelated.

Each image is 1739x154, and the butons are 429x39, and they all have a Rolover state associated

Is there any way to eliminate this pixelation?

This topic has been closed for replies.
Correct answer RodWard

If you want to eliminate the pixilation, you need to avoid resizing of the images.  You've currently resized them from 1739x154 down to 429x39 to fit inside these buttons.

Create some images at the right size so that they can be used at exactly 100% in the buttons, no resizing, and then you'll get better results.  You will also find the filesize of your project will benefit because you won't be wasting bandwidth.

2 replies

RodWard
Community Expert
RodWardCommunity ExpertCorrect answer
Community Expert
May 19, 2018

If you want to eliminate the pixilation, you need to avoid resizing of the images.  You've currently resized them from 1739x154 down to 429x39 to fit inside these buttons.

Create some images at the right size so that they can be used at exactly 100% in the buttons, no resizing, and then you'll get better results.  You will also find the filesize of your project will benefit because you won't be wasting bandwidth.

Lilybiri
Legend
May 18, 2018

Are you talking about those circles? Are they the image buttons? I don't think so, because of the resolutions you are mentioning: What are those resolutions, if they are the original size of the images and the size after resizing in Captivate: avoid resising in Captivate totally, create the images in the exact size you want to use them.  Maybe show a screenshot of the Object State panel?

Participant
May 18, 2018

Sure thing

This one is of the transform setings

Style settings

Lilybiri
Legend
May 18, 2018

You don't seem to understand what I asked: Object State panel. I see that you are usig another language for the object names, maybe that is the problem.

Why are you using Image button for such a simple button? Wanted to see the changes in the Rollover and Down states.