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.

New (SIFR) Portfolio Website

Featured Replies

Hi all,

 

I havn't been around in a while, been really busy, especially with my new site.

 

Its heavy sifr based, and if you havn't got either flash or java script enabled the site should just look like a real mess! (the punishment for working with sifr)

 

Any how, let me know what you web specialists think...

 

 

 

Thanks in advance

 

CLICK HERE

  • Author

looks very nice but ...

you have a delay on your rollovers - preload !

 

 

trying to sort that! not easy when you have 10+ js files :-(

  • Author

The roll overs look nice to me.

Nice colours and nice texture.

 

What's the black bar about beneath the footer, black and brown don't really work together.

 

 

thanks for your reply - I guess you have a point about the black & brown, will look into it.

thanks for your reply - I guess you have a point about the black & brown, will look into it.

 

Best way to preload is not to use javascript.

 

just before

</body>

tag put:

 


<div id="preLoad" style="display:none">
<img src="nav1_hover.gif" width="" height="" />
...
..
...
and so on
</div>


  • Author

Best way to preload is not to use javascript.

 

just before

</body>

tag put:

 


<div id="preLoad" style="display:none">
<img src="nav1_hover.gif" width="" height="" />
...
..
...
and so on
</div>


  • Author

thanks for the suggestion...

 

but with over 100 images it will be a very very long list :wacko:

You only need to preload hover images, of which theres like 4?

  • Author

You only need to preload hover images, of which theres like 4?

  • Author

Your right, thanks

 

but as the site grows, there will be lots of hover state images.

  • Author

thanks for the comments,

 

any other opinions? :santa_cool:

Really nice site. If you got rid of the black box at the bottom and sorted out the rollovers you'll be laughing.

It's a very nice looking site, the only thing at fault is the flash of unstyled content and rollover image delay. These can be remedied in a few ways. But I'll list the ways I'd go about doing it.

 

First off, I'm not the biggest fan of sIFR. Have you ever thought of using a solution like Cufon or Typekit?

 

Secondly, I would probably consider using CSS sprites for your rollovers. It'll rid you of any preload delays altogether, as well as reducing the amount of images used throughout the site.

 

Just my 0.02p.

  • Author

It's a very nice looking site, the only thing at fault is the flash of unstyled content and rollover image delay. These can be remedied in a few ways. But I'll list the ways I'd go about doing it.

 

First off, I'm not the biggest fan of sIFR. Have you ever thought of using a solution like Cufon or Typekit?

 

Secondly, I would probably consider using CSS sprites for your rollovers. It'll rid you of any preload delays altogether, as well as reducing the amount of images used throughout the site.

 

Just my 0.02p.

 

 

Thanks, CSS Sprites may not be such a bad idea in this case.

Hola Daniel,

 

Realy great design.

 

Why not to make the Feature projects' preview images of the same height and width, say 250x135px? Then you would need only one image for rollover effect - semitransparent PNG with the same sizes.

  • Author

Would there be a way to preload sIFR ? So the 'non-sIFR' text doesn't show up at all...

 

My link

To satisfy our old good beloved IE 6 add a couple of lines to the end of CSS code:

* html .featured_image a 	 {background: none;}
* html .featured_image a:hover {background: none; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='over.png', sizingMethod='crop');}

 

Link

Good luck!

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.