Issue with UI hover

Help and Feedback Scripting Support
, , ,
1

I was working on my project and found an issue with this script

Before entering UI

image
image1366×768 52.6 KB

After entering UI

image
image1366×768 51.4 KB

UI with 0 background transparency

image
image1366×768 113 KB

Script 
script.Parent.MouseEnter:Connect(function()
	script.Parent.ImageColor3 = Color3.new(0, 0, 0)
end)
script.Parent.MouseLeave:Connect(function()
	script.Parent.ImageColor3 = Color3.new(255, 85, 0)
end)

I want the bar to turn black once I enter the bar and not once I enter UI.
But it’s not working the way I want, once I set BackgroundTransparency = 1, it’s turning black before I enter the bar itself (ik that’s how it works but I don’t want that)…
Any help would be appreciated :slight_smile:

2

Color3.new() has a min and maximum value of [0,1] for each value of Red, Green, and Blue which would mean you’d need decimal values to achieve the colors you want. You should use Color3.fromRGB() to set the color of the frames.

You need to connect a MouseEntered() event on the bar instead of it’s holder frame.

3

by bar I mean the image in the ImageButton…script.Parent refers to the ImageButton.
And there is no issue with the colors, it changes before it enters the image(once it enters the UI, not the image inside it)

4

Are the white background and the orange image separate or is that the entire ImageButton?

5

both are same image, in the game, background image is set to 1…

6

this is the image…
Untitled_design-removebg-preview (1)

7

The event uses the UIElements size instead of the rendered image that it’s set to. The extra space around the bar is what’s causing this problem, it’s reacting correctly since your mouse is touching the ImageButton.

8

yea im aware of that…
any solutions for that ?

9

im want to make the remote event to fire when the mouse enters rendered image and not the UI

10

You’d need to edit the image and remove the extra space so it’s flush with all sides of the image.

Exp
Exp1152×648 8.28 KB

1 Like
11 
script.Parent.MouseButton1Click:Connect(function()
 if script.Parent.BackgroundColor3 == Color3.fromRGB(0,0,0) then
  script.Parent.BackgroundColor3 = Color3.fromRGB(255,85,0)
 elseif script.Parent.BackgroundColor3 == Color3.fromRGB(255,85,0)
  script.Parent.BackgroundColor3 = Color3.fromRGB(0,0,0)
 end
end)

I also typed it with my hands.

12

I created this image just for this post, I can crop and make it work fine but the problem is in the actual project, I have image of different shape like triangles, circle and many irregular shaped images…
so anything else ?

13

Try my script, maybe it’ll help you.

If it’s not working, replace BackgroundColor3 to ImageColor3

14

Irregular shapes will always have this problem, unless they can be flush with no extra space. Unless Roblox can make a feature to help it’s unfortunately the best we can do at the moment.

15

thanks for the effort, but that’s not solution for the issue i’m facing…
you can understand the issue here
Issue with UI hover - #7 by desinied and here
Issue with UI hover

16

hmm… then ig we will have to go with this, all the images for this covers the complete screen and have BackgroundTransparency = 1(even for a small image) it’s gonna be a struggle for me now

1 Like