Simple Machines Community Forum

SMF Support => SMF 2.0.x Support => Topic started by: Grammy on July 12, 2016, 04:22:38 PM

Title: Fader Weirdness
Post by: Grammy on July 12, 2016, 04:22:38 PM
I never really found a resolution on THIS THREAD (http://www.simplemachines.org/community/index.php?topic=518953.20) and haven't had much luck finding other search results.

The fader does some weird stretching and yawning on not only my heavily modded production forum, but on all my test forums, including the newest one with only two mods:  SimplePortal and Profile Statuses.  I've just disabled the portal; no change.

Stretching:  Shrinking down or expanding wider, depending on how many lines of text are in the news item.  (I have fixed this by by giving the fader a specific height (80px) on the production site, but haven't yet edited the files on this test site.)

Yawning:  Gaping wide open on page refresh (either clicking refresh or returning to the board index after reading a topic) to reveal all the news items at once, then settling back down after a few seconds and doing the fader thing.

Does anyone know why this happens?  I see various fader topics but can't seem to zero in on why it's a bit glitchy.

2.0.11 default


ETA:  Tested this on Chrome, Firefox, Safari, all the same.  I would imagine any of you would be able to duplicate this on your own test forums, by adding several news items, different numbers of lines, then firing up the fader.
Title: Re: Fader Weirdness
Post by: Arantor on July 12, 2016, 04:58:25 PM
Because they're all in the page HTML, and then the JS kicks in once the page has loaded.

Not great, but not a bug.
Title: Re: Fader Weirdness
Post by: Grammy on July 12, 2016, 05:14:17 PM
Quote from: Arantor on July 12, 2016, 04:58:25 PM
Because they're all in the page HTML, and then the JS kicks in once the page has loaded.

Not great, but not a bug.


Ah...  so the "fixes" I've seen such as assigning a background color to the fader, or trying to connect its behavior to a particular mod aren't really germane.  Probably the best way of living with it would be to not overtax the news in the first place; just say it all and be done.   :D

That being the case, I can't see how the behavior will change in 2.1 so I won't ask for a fix.   It is what it is, apparently. 
Title: Re: Fader Weirdness
Post by: Sir Osis of Liver on July 12, 2016, 05:16:44 PM
Quote from: Grammy on July 12, 2016, 04:22:38 PM
I would imagine any of you would be able to duplicate this on your own test forums, by adding several news items, different numbers of lines, then firing up the fader.

Yes, that's how it works.  You can fix the height as you've done, but you have to limit the news item lengths accordingly.  Would be better if the div height adjusted itself to the largest item, and centered all other items vertically in that height.  Don't see any simple way to fix the other problem.
Title: Re: Fader Weirdness
Post by: Grammy on July 12, 2016, 05:20:18 PM
I wonder, then, if there might be a way to "freeze" the fader?  I do like the news appearing just there in that white, centered field, above the boards, rather than top right(ish).  Is there a way to just condense the news into a few lines and have it sit there without doing anything?  (It doesn't appear there unless the fader is turned on.)  I sure would like to utilize that particular div, though.   ;)
Title: Re: Fader Weirdness
Post by: Illori on July 12, 2016, 05:22:04 PM
you can try the package attached. once installed go to the modification settings page in admin and you can set a min height in px for the fader. it is not ideal but if the size is as large or larger then the largest news you have it should make the issue less apparent.
Title: Re: Fader Weirdness
Post by: Grammy on July 12, 2016, 05:23:42 PM
Thanks, Illori!  I'm trying that right now....
Title: Re: Fader Weirdness
Post by: Sir Osis of Liver on July 12, 2016, 05:26:43 PM
If you condense everything into one news item, it's just a static display.  That's how I've always used it.
Title: Re: Fader Weirdness
Post by: Grammy on July 12, 2016, 05:27:41 PM
Quote from: Sir Osis of Liver on July 12, 2016, 05:26:43 PM
If you condense everything into one news item, it's just a static display.  That's how I've always used it.


My "D'oh" moment...  Of course!   :D


Quote from: Illori on July 12, 2016, 05:22:04 PM
you can try the package attached. once installed go to the modification settings page in admin and you can set a min height in px for the fader. it is not ideal but if the size is as large or larger then the largest news you have it should make the issue less apparent.


Of course, the page refresh yawn can't be helped, but this definitely makes the whole thing much smoother!  Thanks for this!   :)
Title: Re: Fader Weirdness
Post by: Antechinus on July 12, 2016, 06:16:24 PM
Quote from: Arantor on July 12, 2016, 04:58:25 PM
Because they're all in the page HTML, and then the JS kicks in once the page has loaded.

Not great, but not a bug.

Actually, this should be fixable with a bit of tweaking. Off the top of my head, the easiest way would probably be to set auto overflow in the CSS, then override that with the js. That way the size shouldn't go bonkers before the js kicked in. I think (more coffee may be required) that would do the trick.
Title: Re: Fader Weirdness
Post by: Grammy on July 12, 2016, 07:08:40 PM
Quote from: Antechinus on July 12, 2016, 06:16:24 PM
Actually, this should be fixable with a bit of tweaking. Off the top of my head, the easiest way would probably be to set auto overflow in the CSS, then override that with the js. That way the size shouldn't go bonkers before the js kicked in. I think (more coffee may be required) that would do the trick.


Ima sit here and wait.....   


:D
Title: Re: Fader Weirdness
Post by: Antechinus on July 12, 2016, 07:19:57 PM
Come to think of it, probably wouldn't even need auto overflow and js override. Just using hidden overflow should do it.

Not going to play with it now though. Have other things to do first.
Title: Re: Fader Weirdness
Post by: Grammy on July 12, 2016, 07:46:15 PM
Quote from: Antechinus on July 12, 2016, 07:19:57 PM
Come to think of it, probably wouldn't even need auto overflow and js override. Just using hidden overflow should do it.

Not going to play with it now though. Have other things to do first.


*heads off to tinker* 

*back*

Just "overflow: hidden;" hates me.   :(

No worries, another day, then.   :)
Title: Re: Fader Weirdness
Post by: Antechinus on July 13, 2016, 04:06:46 AM
Quote from: Grammy on July 12, 2016, 04:22:38 PMYawning:  Gaping wide open on page refresh (either clicking refresh or returning to the board index after reading a topic) to reveal all the news items at once, then settling back down after a few seconds and doing the fader thing.

Can't reproduce this on local. Do you have an online example?
Title: Re: Fader Weirdness
Post by: Grammy on July 13, 2016, 07:07:53 AM
Quote from: Antechinus on July 13, 2016, 04:06:46 AM
Can't reproduce this on local. Do you have an online example?


I do; I'll PM the login to you.  I installed Illori's height fix but I just uninstalled it so that you could watch the scroller go through its contortions.  The yawn on refresh happens with or without the height fix, though.  The fix just makes it more stable while the page is resting.   :)
Title: Re: Fader Weirdness
Post by: Sir Osis of Liver on July 13, 2016, 12:18:34 PM
Quote from: Antechinus on July 13, 2016, 04:06:46 AM
Quote from: Grammy on July 12, 2016, 04:22:38 PMYawning:  Gaping wide open on page refresh (either clicking refresh or returning to the board index after reading a topic) to reveal all the news items at once, then settling back down after a few seconds and doing the fader thing.

Can't reproduce this on local. Do you have an online example?

Happens every time on clean test install.  Maybe it's too quick to see running local?
Title: Re: Fader Weirdness
Post by: Grammy on July 13, 2016, 06:25:20 PM
Quote from: Sir Osis of Liver on July 13, 2016, 12:18:34 PM
Happens every time on clean test install.  Maybe it's too quick to see running local?


That's been my experience.  Every single time.   :(
Title: Re: Fader Weirdness
Post by: Antechinus on July 13, 2016, 07:24:36 PM
Aha. I see what you mean. The way you worded it on your OP, I thought you meant it was breaking for width ("Yawning:  Gaping wide open on page refresh") since you had already mentioned the varying height with varying content (Stretching:  Shrinking down or expanding wider, depending on how many lines of text are in the news item).

You could use a CSS  tweak to get around this if you really wanted to. If you're going to set a fixed height anyway, adding hidden overflow as well as the fixed height should sort it.
Title: Re: Fader Weirdness
Post by: Grammy on July 13, 2016, 07:54:44 PM
I thought it should, but no dice.   :(

#smfFadeScroller
{
height: 100px;
background-color: #ffffff;
text-align: center;
padding: 0 2em;
overflow: hidden;
margin: 1em 0;
color: #575757; /* shouldn't be shorthand style due to a JS bug in IE! */
}


I also tried with min-height.  Thanks for checking it out, though. 
Title: Re: Fader Weirdness
Post by: Antechinus on July 13, 2016, 07:59:01 PM
Try it with max-height.
Title: Re: Fader Weirdness
Post by: Grammy on July 13, 2016, 08:09:29 PM
No, it won't play.  I guess the Javascript wins this round.   :-\

This also happened on my first test board which was 1.1.11, so I guess it's been an issue for quite a while.  Odd little quirk. 
Title: Re: Fader Weirdness
Post by: Antechinus on July 13, 2016, 08:18:23 PM
Very odd.
Title: Re: Fader Weirdness
Post by: Sir Osis of Liver on July 13, 2016, 10:22:43 PM
Don't know what you're seeing, but this works for me -



#smfFadeScroller
{
text-align: center;
padding: 0 2em;
overflow: auto;
margin: 1em 0;
color: #575757; /* shouldn't be shorthand style due to a JS bug in IE! */
height: 60px;
}



Still loads multiple items on refresh, but height doesn't change.

Title: Re: Fader Weirdness
Post by: Grammy on July 13, 2016, 10:44:36 PM
Quote from: Sir Osis of Liver on July 13, 2016, 10:22:43 PM
Don't know what you're seeing, but this works for me -



#smfFadeScroller
{
text-align: center;
padding: 0 2em;
overflow: auto;
margin: 1em 0;
color: #575757; /* shouldn't be shorthand style due to a JS bug in IE! */
height: 60px;
}



Still loads multiple items on refresh, but height doesn't change.


I did end up assigning a height to it on the test site (I used Illori's min-height fix on the production site) but it's the gaping open and showing all the news at once on refresh that's so annoying.  Right now, I'm doing as you suggested and just putting all the news in one field and letting the fader just sit there.  Considering what Arantor said, I think I'm stuck with it.   :)

Quote from: Arantor on July 12, 2016, 04:58:25 PM
Because they're all in the page HTML, and then the JS kicks in once the page has loaded.

Not great, but not a bug.
Title: Re: Fader Weirdness
Post by: Sir Osis of Liver on July 13, 2016, 10:54:41 PM
It doesn't gape open with that code on my test install.  You can see it briefly loading multiple news items, but the height remains at 60px on refresh, it just adds/removes a scrollbar.  It's not bouncing the board index up and down, which is the really annoying thing.

Title: Re: Fader Weirdness
Post by: Grammy on July 14, 2016, 07:00:08 AM
Quote from: Sir Osis of Liver on July 13, 2016, 10:54:41 PM
It doesn't gape open with that code on my test install.  You can see it briefly loading multiple news items, but the height remains at 60px on refresh, it just adds/removes a scrollbar.  It's not bouncing the board index up and down, which is the really annoying thing.

No, I see what you mean...  it's briefly showing all the news at once, but it's not going into contortions now, when it does.  The page stays relatively stable.  But I can't think why....   I mean, I'm fairly certain I tried every height fix possible, including min and max.  But this makes it much less annoying!  Thanks; I'll keep it!   ;)