Fan of the Arts

uli · 2011-09-16 21:57:10

renobird wrote:

When you say “the fan is completely hidden on the main page only a few pixels after leaving its top edge” do you mean that it jumps from visible to hidden for you?

No, the pixel phrasing was misleading, the fan behaves for me exactly as you intended. But although it belongs to the header it scrolls out of sight rather quickly, and the ribbon nav is what remains to represent the brand all down to the bottom of the page, the fan being invisible for around 95% of the page height. In this respect, the fan on the archive page – centered as it is there and without text – appears rather decorative and not like a logo, and so I didn’t even get the idea I could use it as a home link.

renobird · 2011-09-18 23:59:44

Thanks for the excellent feedback everyone…

I’ve implemented some of your suggestions. Some others — such as the news archive — have been tabled for now. In that particular case we decided to remove the archive until there was actually more news than fit on the homepage. Uli, thanks for you feedback on that.

Patrick, tried leaving a hash in the URL, but it caused the smooth scrolling to act a bit funky. I like the idea of a hash, but still haven’t figured out a clean method that works with the scrolling. yet. :)

OK, now back to wrapping up some other sites. Maybe I can get another one up here before the end of the month.

:)

Gocom · 2011-09-19 02:16:59

The contact form is much better :-) Nice.

renobird wrote:

tried leaving a hash in the URL, but it caused the smooth scrolling to act a bit funky. I like the idea of a hash, but still haven’t figured out a clean method that works with the scrolling. yet. :)

Yeah, that is kind of expected. If a hash is left to the location, one that matches an element, the browser will jump to that location.

That scrolling issue it is solve-able (to some extent), for example by using an anchor that doesn’t exists. As preventing the click from activating is preferred, it’s probably best to add something directly to the hash (plus that way it keeps JavaScript-less navigation working). I.e.

window.location.hash = '#section-' + this.hash.substring(1);

That would be directly usable in the Fan of the Arts’ code too. In the code in question would go to the smooth scrolling block as follows:

/**
	Smooth scrolling clicks (I'm here to make Textile's bc. to work with the indentation :wink:).
*/
	$(".navlink, .smooth").click(function(event){
		event.preventDefault();
		window.location.hash = '#section-' + this.hash.substring(1);
		$('html,body').animate({scrollTop:$(this.hash).offset().top - 60}, 700);
	});

That fixes back/forward buttons (as the location changes, history is generated), but it doesn’t yet allow bookmarking of the sections, as the anchor isn’t real. No keeping it real this time, fakes have to suffice (but mom, I don’t wanna). If the page is loaded with a hash, Mr. JavaScript could tab the fine gentleman to correct location, like so.

/**
	If the page is loaded with a hash in the location,
	scroll to that specific section
*/
	if(window.location.hash) {
		$('a.navlink[href="#'+window.location.hash.substring(9)+'"]').click();
	}

Placed after the smooth scrolling block above, that would make the page to scroll to correct section when the page is loaded with a hash. Bookmarking, yeah. I personally use same type of solution when doing something similar (or carousels or tabs). Not probably the most best solution out there as it involves click event, but it re-uses the same code and keeps it simple and works at least with majority of browsers.

Speaking of JavaScript — and script tags — one of the <script> tags misses the type attribute (that thing should be there, maybe).

hakjoon · 2011-09-19 14:53:19

Html5 doesn’t require type attributes for script tags anymore I believe.

You could update the url with the Hash after the scroll. That way the page would already be where you want it to be so there should be no jump (reality may differ). So have the anchor have a hash, intercept the click, scroll the page to the ID specified in the hash, then change the location hash. This should also make it all work without JS (minus fancy scrolling).

You might need to reposition the ID’s to deal with offsets etc, you are introducing in the JS, in order to not incur jumping.

Might not be worth the hassle.

Textpattern CMS

Textpattern CMS support forum

#13 2011-09-16 21:57:10

Re: Fan of the Arts

#14 2011-09-18 23:59:44

Re: Fan of the Arts

#15 2011-09-19 02:16:59

Re: Fan of the Arts

#16 2011-09-19 14:53:19

Re: Fan of the Arts

Board footer