Mouse hover effect support

I have read several articles on this about the mouse hover effect when you hover your mouse over the ad. Here I want when the customer drags on the product, the border will be highlighted. Please help.

Google Ads 300x250.zip (49.4 KB)

I did it. Please close topic.

No need to close, maybe you can post how you did it to help future others :+1:

actually i just tried again and this problem still not resolved. I want when the mouse hovers, the border will change color and the other elements contained in the shape also change color, but not yet. Please help!
Google Ads.zip (49.8 KB)

Another problem arises when I click on the "see more" button it cannot take me to the predefined URL if I select "Ignore all pointer events". But if selected, when the mouse over Butten "See more" is selected, it will conflict with the effect of appearing the outer border of the element. Please help.

I also want to include the price in my banner ad, but the Curency character here can't go up like the way I want to show it. Do you think this feature should be added? And now if I want to fix this, how will I do it?

After all i'm having a real challenge with:

  1. How when the mouse out effect on the button doesn't re-launch my border changer effect.
  2. I want my border effect to run on the main timeline but when there is a mouse hover effect this main timeline will stop.
  3. I want my ad to loop over the main time about 3 times before stopping completely.
    Please help!
    Google Ads.zip (50.5 KB)

Hi,

You need to zip and post the Hype project not the exported files.

Sorry i am quite new. Can you guide me how to save it properly and upload it here?

Find your Hype project file ( i.e. foo.hype ) in the Macs Finder.

Control + Click on it to get a contextual menu on it.
Select compress…

You should then get a new zip file probably named Archive.zip.
Add that file to a post.

i tried again and attached it at the bottom, please take a look. Thank.
Google Ads.zip (325.6 KB)

1 Like
  • I put the currency symbol in the text with sup
  • you animated the same items in different timelines and that can lead to problems. I added the timelines (flash) to have them on a trigger on the main timeline instead of directly
  • whole card is clickable
  • loop counter store variable in hypeDocument and only pauses

Hope that helps to get you started

Google Ads Max.hype.zip (354,5 KB)

5 Likes
  • I can understand your sub part.

  • I can also understand how you make my elements (especially the button part) not re-enable border effects.

  • however about the main timeline I probably need you to elaborate a bit more:

  1. The gradient border effect will occur when there is a mouseover event. And play in reverse when dragging the mouse out. However how can you get the main timeline to run automatically when there is no event triggered by the mouse flash?
  2. Will this loop still work if I take all your code and move it into another project?

Can you explain more specifically about your mode setting mechanism?
image

To start of I would probably done it all with symbols to begin with. I worked with what you provided and in that sense you guide the solution by the way you structured your file to begin with. That said

  • great that you looked up sup
  • the timeline reset is probably not needed anymore (custom behavior)
  • about moving code. Hype is a visual interface that stores its setup in its own files (.hype, .hypetemplate, .hypesymbol) and therefor you create reusable templates or symbols. Moving code entails recreating everything. It works but has the most work attached. Rather build yourself a template library.
1 Like

Thank you for your help. I've customized your script the way I want, but I'll probably have to learn a lot more about reusing these elements in the future.

One more thing I need your help with is that the image is quite blurry in the preview mode although in the editor everything is very clear. And I also don't know how to upload this element on my wordpress site.

Just disable image optimization in the resource panel (each image has that option).
For WordPress use the Hype Tumult Plugin found in the official WordPress Repo (just search for it under plugins).

Sorry for being an advertiser, I'm not very familiar with how this app works. Can you show me a little more clearly, if there are screenshots all the better. I have edited a bit with the file you sent, can you give me an example of the application of a symbol? Currently every element I have to repeat the operations quite a few times.
Google Ads edit.hyperesources.zip (170.1 KB)

when i try to upload google html5 validator it shows the following. I then added exit actions on my file, but it still didn't work. Is there any solution for that?
Google Ads Max.hyperesources.zip (170.4 KB)

did you use the matching hype-exportscript to built your ad?
step over here to lookup the exportscripts: Tumult Hype — Export Scripts
sounds in your case you may need the Google Ads (AdWords)-script

2 Likes

You're welcome to post what exactly what was uploaded to generate that error, but I think @h_classen probably is giving the correct advise as I can restore your document from the posted export and re-export as AdWords and it works correctly. You'd use this export script:

Google Ads: https://tumult.com/hype/export-scripts/AdWords/AdWords.pkg

And then make sure to do a File > Export as HTML5 > AdWords… export instead of a normal one.

If that still doesn't work, feel free to upload a zip of your .hype document (not a .hyperesources export, but your actual working document) and the .zip you are uploading to google ads.

1 Like