Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

Information to fade in, fade out to next

Featured Replies

Hey guys!

 

I've come up with an idea on how to display some pieces of information, but not sure how to go about designing it.

 

Basically, what is displayed is a small 160x120 image, alongside a short paragraph next to it. Currently it is displayed in a 2x2 table but it doesn't look great.

 

Ideally, I something that can fade in and fade out, each piece of information.

 

E.g.

 

First picture and text, then it fades out, next picture and text fades in, then that fades out and onto picture and text 3.

 

How would I do this?

 

Been thinking of PHP/Java/AJAX but not really sure. Can anyone offer a starting point?

 

FYI, the data (mainly the abstract) is pulled using php/sql from a database.

 

Hope you can help :D

 

Cheers!

This sounds interesting. I did a flash file yesterday to accomplish this with images and just put static text beside it, but I could definitely use what you're thinking of to make it even better. I'll be watching to see if anyone has suggestions.

  • Author

That looks like what I was looking for!

 

I had seen some like that, but not quite as 'elegant' with the fading in and out.

 

Thanks for the link, it is much appreciated!

Create an account or sign in to comment

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.