dutch_rc

Tamiyaweb.com - update

Recommended Posts

Hi guys,

Like some of you may have noticed from my forum signature, I've been working on a Tamiya fan website with database for a while. I'm lucky enough to have a huge amount of reference docs (dealer lists, guide books among other things) and together with an effort to develop some webdesign skills, I've been making these available online.

This post is about the aforementioned developing... :huh:

I've created a page that's responsive to different screen sizes and put some jQuery (Javascript) tricks in it to make that all work. I've tested it on all major browsers but only with a mouse on my desktop.

Since I don't have any gadget with touchscreen, I am not sure those will fully function.

That's why I would really appreciate some feedback from anyone with a similar device.

Mostly Apple and Samsung (they use different code) but any reply is welcome.

Biggest question - can the page below be normally scrolled on a touchscreen?

http://tamiyaweb.com/model/list

Thanks in advance. :)

  • Like 1

Share this post


Link to post
Share on other sites

Mostly Apple and Samsung (they use different code) but any reply is welcome.

Biggest question - can the page below be normally scrolled on a touchscreen?

Yes (on an iPad)

Share this post


Link to post
Share on other sites

I'm looking at this on a Samsung phone, and the text is extremely small. Otherwise, the scrolling is working. Is it the sticky header and footer that you're working on?

Share this post


Link to post
Share on other sites

The site looks the same in my regular PC browser as well as on Windows Phone 8.1. No optimization for small screens visible, if there is any. Performance wise, the Javascript thingy runs pretty poor on mobile devices.

The information on your site is good, but design-wise it is stuck in the early 2000's. Keep on the good things and try improving the general design to make it more nice to read. :)

Share this post


Link to post
Share on other sites

Works fine on my BlackBerry playbook, scrolling isnt smooth though

Share this post


Link to post
Share on other sites

Thanks for the replies, guys. Glad the scrolling is working at least. Thing is, it's not really a direct scroll - I am translating mousewheel turns into an animation with jQuery that only mimics scrolling behaviour.

It's a small plugin that I wrote myself (since something like it didn't exist yet) :

http://ataredo.com/morphology/lucidscroll/

Wasn't quite sure binding the mousewheel event would get accepted by all operating systems.

I guess it might be a bit too much calculation for the current computing power of mobile devices...

I'm looking at this on a Samsung phone, and the text is extremely small. Otherwise, the scrolling is working. Is it the sticky header and footer that you're working on?

Yes, I was indeed also working on the sticky header and footer.

I'm giving myself a bit of extra trouble because I'd like the footer to be slightly floating above the bottom.

Because of this I had to create some overlapping viewports (and implement an animated scroll).

The tiny text is certainly something I'll have to look into...

Thanks for all the feedback, it is very worthful info. :)

Share this post


Link to post
Share on other sites

Cheers, putting everything online is pretty much an endless job, especially with a certain perfectionist attitude.

I'll be focusing on adding the guide book entries with the models' specifications first...

Then there's finishing the dealer lists before getting to the exploded views.

:rolleyes:

I've changed the characteristic of the scrolling on that page (that's what the little script can do).

Animation with jQuery is a cool thing in itself but can lead to sea sickness if the wrong values are used.

It should very much resemble default Firefox smooth scrolling now.

:)

By the way, Greg... I'm not much a fan of media queries. Think they are 'ugly' coding.

But I guess it's either that or make a separate mobile site.

I did not get to serving the very small screen sizes yet. The page's responsiveness stopped at around 700 pixels.

Keep working on it...

Share this post


Link to post
Share on other sites

Great work! Using an iPhone 5s, and it's working ok. Just as others mentioned, scrolling is a little slow.

Share this post


Link to post
Share on other sites

:)

Thanks for the feedback, good to hear it's Apple compatible (they can be tricky).

I might disable the animated scroll so it's a bit easier on mobile devices...

Share this post


Link to post
Share on other sites

Hey guys,

This time it's not an actual update yet but I would very much appreciate some feedback on this feature I'm trying to develop which I could implement on the sitelater. It's a lightweight plugin that makes things draggable. The point is that I'm trying to make it touch device compatible but I cannot check myself if it actually works.

The code is on a separate site (Codepen) for testing and this doesn't quite work yet on mobile phones. So if anyone has a tablet with an Android or iOS operating system, could you quickly check if the square on this page can be dragged around?

http://codepen.io/Shikkediel/pen/ZYbWzL

Hope you don't mind me 'abusing' the large and often responsive audience here for this.

Many thanks in advance in any case.

:)

Share this post


Link to post
Share on other sites

The dragging you mentioned works on Windows Phone 8.1. :) Cool, eh?

  • Like 1

Share this post


Link to post
Share on other sites

Cheers, that's good news. I had to read up on Windows touch events but it looks like they are also supported (and thus are triggered in the script). It would be a great solution to make elements draggable, otherwise one would need a whole lotta code and library plugins...

:)

Share this post


Link to post
Share on other sites

works on ipad , slow , but that can be internet ( slow in Aus )

  • Like 1

Share this post


Link to post
Share on other sites

Excellent, that would mean it's cross browser functional (I suspect Samsung will work as well as it's very similar to Apple). B)

Thanks, guys!

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now