I know it’s a bit over-used but I genuinely have a client who makes metal widgets and would like a “subltle” brushed metal bg on his site but no matter how carefull I am in photoshop when I tile the bg image I can “see the join” see here:
Looks like you have a 1px line on the left side that’s slightly off
colour. Fix that up (maybe just delete it by marquee-ing all but that
1 line in PS) and it should be fine. Note that if the page ever
extends over 800px or whatever the height of the image is will show
the background color of the page at the bottom because it isn’t a two
way tileable image.
Hope this helps.
Joe
On 31 Jul 2008, at 13:55, Roger Burton wrote:
I know it’s a bit over-used but I genuinely have a client who makes
metal widgets and would like a “subltle” brushed metal bg on his
site but no matter how carefull I am in photoshop when I tile the bg
image I can “see the join” see here:
Hi Roger,
This is probably a very amateurish way to do this…but when I’m making a background that has transition I create a new blank very large page, then I draw a graphic to fit the page and apply a fill master action to it to get the desired look. Then I preview the page in a browser window and save the resulting .gif graphic that Freway produces, then I apply that .gif graphic as my page background.
Not sure if that is what you are after.
Rich
Here’s my favorite trick for this effect. Make a really large metal
pattern, maybe 500 x 500 (gray, add noise, motion blur horizontal a
lot, repeat, adjust contrast), then use Filter > Other > Offset to
roll the image around 50% in both directions. You should see a cross
in the middle of the image that is your mis-matched offset. Use
cloning tools to remove it, then use Offset again at 25% to get the
last little bits from the edges. Now try out your pattern. It should
line up perfectly.
Walter
On Jul 31, 2008, at 8:55 AM, Roger Burton wrote:
I know it’s a bit over-used but I genuinely have a client who makes
metal widgets and would like a “subltle” brushed metal bg on his
site but no matter how carefull I am in photoshop when I tile the
bg image I can “see the join” see here:
I don’t have vista here so cant see that problem and as you mentioned it works fine on other browsers.
I am assuming you are using the webyep menu and then loops on the page have you tried testing it without the menu.
In other words just a loop on a single test page, that way we could isolate if its the menu system or the loops or the lightbox part. The other thing is are you using the standalone loop start action, the new item loop start function, or the crowbar method?
Updated to a newer lightbox compatible version, but the issue still persists, on all versions of IE (The background “overlay” does not reach 100% to the bottom of longer pages.
Looking at the Lightbox 2 CSS file at the background overlay properties:
The height is 500px, which looks like what is extactly happening in IE. But is showing 100% depth in PC Firefox, and Mac Browsers on long pages.
Are there any CSS gurus that could advise how to make the lightbox overlay background stretch to 100% depth? (putting the height as 100% does not work by the way)
I have heard about this problem before and from what I recall… if you do have a background colour and you apply not only the browse window but the entire HTML page, IE sloooowwwds down to a bit of a crawl… well that’s what I remember, I think I read this problem about the slimbox (Mootools version). I suspect the only way round this speed issue was for the developer of these effects to restrict the colour overlay to just effect the visable browser window. I have never seen a viable work around but thats not to say it doesnt exist.
Have you tried contacting the Lightbox developer directly?
Perhaps this is why only the top (first loaded) visible part of the html page is covered by the overlay in IE.
Its a big disappointment, IE spoils the party again, big time. This means that many Mac users are thinking lightbox its working correctly, but IE users see the fault on any long page on images where your scroll down.
David
On 12 Aug 2008, at 09:15, max wrote:
Hi David
I have heard about this problem before and from what I recall… if you do have a background colour and you apply not only the browse window but the entire HTML page, IE sloooowwwds down to a bit of a crawl… well that’s what I remember, I think I read this problem about the slimbox (Mootools version). I suspect the only way round this speed issue was for the developer of these effects to restrict the colour overlay to just effect the visable browser window. I have never seen a viable work around but thats not to say it doesnt exist.
Have you tried contacting the Lightbox developer directly?
kind regards max
David Owen
Freeway Friendly Web hosting and Domains ::
(Test Drive a web hosting account for Free)
This looks like the section of lightbox.js getting the page height. Could any Javascript guru’s comment as to why the IE problem?
// getPageSize()
//
getPageSize: function() {
var xScroll, yScroll;
if (window.innerHeight && window.scrollMaxY) {
xScroll = window.innerWidth + window.scrollMaxX;
yScroll = window.innerHeight + window.scrollMaxY;
} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
xScroll = document.body.scrollWidth;
yScroll = document.body.scrollHeight;
} else { // Explorer Mac...would also work in Explorer 6 Strict, Mozilla and Safari
xScroll = document.body.offsetWidth;
yScroll = document.body.offsetHeight;
}
var windowWidth, windowHeight;
if (self.innerHeight) { // all except Explorer
if(document.documentElement.clientWidth){
windowWidth = document.documentElement.clientWidth;
} else {
windowWidth = self.innerWidth;
}
windowHeight = self.innerHeight;
} else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
windowWidth = document.documentElement.clientWidth;
windowHeight = document.documentElement.clientHeight;
} else if (document.body) { // other Explorers
windowWidth = document.body.clientWidth;
windowHeight = document.body.clientHeight;
}
// for small pages with total height less then height of the viewport
if(yScroll < windowHeight){
pageHeight = windowHeight;
} else {
pageHeight = yScroll;
}
// for small pages with total width less then width of the viewport
if(xScroll < windowWidth){
pageWidth = xScroll;
} else {
pageWidth = windowWidth;
}
return [pageWidth,pageHeight];
}
After looking at Lightbox2 on a
PC box, which the overlay works OK in scrolling IE6 page. I have to
assume there is something on my page, Web-Yep loop, or how FW5 is
creating the code that is causing the issue.
David
On 12 Aug 2008, at 09:15, max wrote:
Hi David
I have heard about this problem before and from what I recall… if
you do have a background colour and you apply not only the browse
window but the entire HTML page, IE sloooowwwds down to a bit of a
crawl… well that’s what I remember, I think I read this problem
about the slimbox (Mootools version). I suspect the only way round
this speed issue was for the developer of these effects to restrict
the colour overlay to just effect the visable browser window. I
have never seen a viable work around but thats not to say it doesnt
exist.
Have you tried contacting the Lightbox developer directly?
Hi David
If you have seen it working on a pc then what I am remembering must be the slimbox only problem.
I was recalling it from memory so I wasn’t sure if applied.
I don’t know why the loop or freeway would have any bearing on the problem but if it does then you will need to go back to Johannes at OBD, as I don’t think there were any real items that you could adjust or change at the freeway end that will make mush of a difference.
Has OBD had this problem before?
and do you have an example online that I could look at.
No loop, just a single (lastest) Web-Yep pop-up action with lightbox 2.0.4 and still the overlay does not work in IE.
Obdev says; “we’ve created a test page with WebYep (image in a loop) and the dimming works fine over the full page also when the page gets very long”, so its must be a Freeway 5 issue (It’s most likely due to the page structure)
Any ideas?
On 12 Aug 2008, at 15:23, max wrote:
Has OBD had this problem before?
and do you have an example online that I could look at.
I would ask Obdev to post a public page where it works, and then you
post one that does not. Xyle scope should be able to sort the
differences. Also, which version of Freeway 5 are you using?
Walter
On Aug 12, 2008, at 1:42 PM, David Owen wrote:
Obdev says; “we’ve created a test page with WebYep (image in a
loop) and the dimming works fine over the full page also when the
page gets very long”, so its must be a Freeway 5 issue (It’s most
likely due to the page structure)
Hi David … I just checked your example, and yep it cuts off,
it also cuts off if you use firefox too. though slightly differently.
Open up your example in a small firefox browser window launch your lightbox example and rather than scroll just re-size the window to a larger size… it too now shows this cutting off problem
I could not repeat this problem on the official lightbox site demo’s though I could with OBD demo page.
If you open up one of the OBD images and resize the page it too shows this problem
i will send in the screen shots to OBD and see if they have seen this before.
Never thought of checking the Obvev demo site with IE6 here, and yes
you’re right the overlay cuts off. And Firefox Mac gives a similar
error if you have the browser to a smaller size and the enlarged.
Thanks for looking at this it much appreciated, I started to think
its just me with the issue !!
I’ll have a look in Xyle scope to see if I can spot anything.
Walter, would you like to take a peak, and see if you can spot
anything that might be causing the issue?
David
On 13 Aug 2008, at 09:33, max wrote:
Hi David … I just checked your example, and yep it cuts off,
it also cuts off if you use firefox too. though slightly differently.
Open up your example in a small firefox browser window launch your
lightbox example and rather than scroll just re-size the window to
a larger size… it too now shows this cutting off problem
I could not repeat this problem on the official lightbox site
demo’s though I could with OBD demo page.
If you open up one of the OBD images and resize the page it too
shows this problem
i will send in the screen shots to OBD and see if they have seen
this before.
Hi david I have had a reply back from OBD and
from what Johannes has described it looks like the problem I have see in firefox is a different issue altogether.
Below is the reply but it does look like it’s something that either the actual lightbox is doing or freeway or a combination … or something else altogether.
I know its not getting us very far in terms of fixing this issue but Walter may know a lot more if he gets a chance to look at it.
Anyway I have pasted the response I received from Johannes… where I described my quick experimentation with firefox as it may help.
Have you seen this before or know what my be causing it.
I’ve only seen this in the page mentioned in the forum post.
In my example and test pages using the Image Element (single, in a
loop, etc.) this behavior does not show up.
So I assume it’s a problem of the combination of Lightbox with the
HTML/CSS code generated by Freeway.
In a small firefox browser window launch lightbox example and rather
than scroll just re-size the window to a larger size… it too now
shows this cutting off problem
IMHO that’s a different issue. If the page really is that short and
the browser window is resized to a height greater than the page’s
content, than the dimmed area will always stop where the page’s
content stops.