Unanswered

Hand curser on Image hover

(0) Share

Report

Posted on by Community Power Pla...

Hi,

Please suggest, how to see Hand curser instead of mouse arrow pointer, while I hover on an image, the image should work as an icon. (exactly like the hand cursor appears on Icons, when we hover-over it)

Regards,
Nandan

Categories:

Building Power Apps

I have the same question (0)

All responses (9)

Answers (3)

Verified answer

Drrickryp Super User 2024 Season 1 on at

Like (3)

Report

Hi @Anonymous

The cursor image is hard coded into PowerApps and is context sensitive to the control being selected. However, to achieve the result you want, put an icon control over the image and size it to the same size as the image. Make color, hover color and pressed color RGBA(0, 0, 0, 0). Now a hand icon will appear over the image.

Was this reply helpful? Yes No
Verified answer

KrishnaV 5,023 on at

Like (5)

Report

Hi @Anonymous ,

As @Drrickryp advised it is hardcoded with an arrow. However, we always have workarounds for every problem 😊. Here is the solution to your issue.
Here is the working model of that.
Coming to implementation part:
Step1: Insert a picture as you wish.
Step2: Add a button on top of that and make it transparent and remove the below list of properties
Remove the color for pressed, Disabled and Hover color fields and select the color as transparent.
Step3: Make image control and button in one group that's it ....

If you do these 3 steps you are on track 😊.

Do let me know if you see any challenges, I am always happy to help.

Regards,
Krishna
if this reply/solution works Mark it as the solution and give a thumbs-up.

Was this reply helpful? Yes No
Verified answer

v-xida-msft on at

Like (0)

Report
Hi @Anonymous ,

Do you want to see Hand cursor instead of Mouse arrow when hovering over the image?

Currently, within PowerApps, if you want to see Hand cursor instead of Mouse arrow when hovering over the image, I afraid that there is no way to achieve your needs.

If your image source is a URL Link (can access without authentication), I think the Html Text control could achieve your needs. Please take a try with the following workaround:

Set the Html Text property of the Html Text control to following:

"<img src='" & "https://c.pxhere.com/photos/f2/a8/squirrel_furry_animal_fluffy_brown_outdoor_small_curious-569161.jpg!d" & "' height='400' width='400' style='cursor:pointer' />"

Note: The cursor attribute in the <img> tag is used to specify the cursor style.

If the source image is not an URL Link, I agree with @KrishnaV 's thought almost. You could consider add a Button control over the image control, make the button over the image control properly. Clear the Text value within the Text property of the Button.

Set the Fill property and HoverFill property of the Button to following:

RGBA(0, 0, 0, 0)

Best regards,

Was this reply helpful? Yes No
KrishnaV 5,023 on at

Like (0)

Report

Hi @Anonymous,

Did you get a chance to try my solution?

I hope this resolved your issue if you see any challenge let me know I am always happy to help.

Regards,
Krishna
If this post helps give a 👍 and if it solved your issue consider Accept it as the solution to help the other members find it more.

Was this reply helpful? Yes No
knsrinath 527 on at

Like (0)

Report

@KrishnaV
Is there any alternate method instead of Image & Button?

Thanks & Regards

Was this reply helpful? Yes No
JamFestival 113 on at

Like (6)

Report

The answer is:
Change the 'tab index' field of the image from '-1' to '0'.
Worked for me.

1 people found this reply helpful.

Was this reply helpful? Yes No
knsrinath 527 on at

Like (0)

Report

Excellent!!!!!!
Working Fine

Was this reply helpful? Yes No
Invisafehz 3 on at

Like (0)

Report

This worked like a charm for me. Super simple fix.

Was this reply helpful? Yes No
BeckyM_RCPI 21 on at

Like (1)

Report

Weird find but totally works! I have a logo image inside my header component and I wanted it to serve as a "Home button". I couldn't use the original solution here because the image is inside of containers to achieve responsive design, so adding a button will not overlap the image (unless it's possible and I just don't know how). However, setting tab index to 0 on the image gave me the hand pointer on hover as desired. Thank you!

Was this reply helpful? Yes No