Rotating Tweet – Collapse Issue
-
http://wordpress.org/support/plugin/rotatingtweets/
I am using the Rotating Tweet Plugin on WordPress and the creator updated so it was responsive.
When testing my responsive site- The width issue has now gone with the update. But if you move the browser back and forth, when it changes from 100% width (small screen and sidebar hidden) to the sidebar visible, the rotating tweet is collapsed and its gone :(. I tried to work around this issue with instead of hiding the sidebar to position absolute and left:-9999px which works fine but not really the right way to go about it. Not sure if anyone has had this issue before ( just could be a css issue) i would be grateful if someone could guide me to where the issue may lie. I can provide the code if necessary!.
Thanks
-
Hi Charliebee,
Sorry it isn’t working.
Have you got the latest version of the plug-in?
I’m not currently detecting for visibility so this may be the problem.
Can you let me know what template you’re using or send me a link to your site?
Martin
Hi there,
Yes, just double checked and have the latest versions.
Unfortunately i cant link to the site as it’s a private project but if you need any code or anything i can provide this.I am using blankslate as the template so it’s stripped everything down in the css. I have tried to put a display:block on the div so when it’s visible again it pops up but no luck.
Thanks for your quick response.
If you switch set
wp_debugtotrueinwp-config.phpyou should get a LOT of JavaScript diagnostics in the console.log which might provide a clue.If it’s not a problem, could you try this and let me know what the results are…
Incidentally, does the site work properly with another browser?
Martin
I’ve had a look and form the console this is what is thrown back:
self_width = 285 rotating_tweet.js:36 parent_width = 285 rotating_tweet.js:37 grandparent_width = 285 rotating_tweet.js:38 rt_target_container_width = 285 rotating_tweet.js:39 rt_target_width = 285 rotating_tweet.js:40 rotate_timeout = 4000 rotating_tweet.js:41 Initial height: 121 rotating_tweet.js:62 Uncaught TypeError: Cannot call method 'create' of undefined measureIt.js:120Hope this is ok? Any other info you need let me know π
If those are the figures, then the rotating tweets should be visible!
Very odd.
Is something set to
display:none;?What appears in the console when you resize?
Sorry i should have expressed myself more:
The above is when it’s full screen and when its re-sized so it goes small and sidebar is hidden with widget in):
============================ rotating_tweet.js:35 self_width = 285 rotating_tweet.js:36 parent_width = 285 rotating_tweet.js:37 grandparent_width = 285 rotating_tweet.js:38 rt_target_container_width = 285 rotating_tweet.js:39 rt_target_width = 285 rotating_tweet.js:40 rotate_timeout = 4000 rotating_tweet.js:41 Initial height: 121 rotating_tweet.js:62 Parent change: 0 rotating_tweet.js:179 Grandparent change: 0 rotating_tweet.js:180 Old box width: 285 rotating_tweet.js:181 New target width: 285 rotating_tweet.js:182 rt_max_width: 285 rotating_tweet.js:183 Parent change: 0 rotating_tweet.js:179 Grandparent change: 0 rotating_tweet.js:180 Old box width: 285 rotating_tweet.js:181 New target width: 285 rotating_tweet.js:182 rt_max_width: 285 rotating_tweet.js:183 Parent change: 0 rotating_tweet.js:179 Grandparent change: 0 rotating_tweet.js:180 Old box width: 285 rotating_tweet.js:181 New target width: 285 rotating_tweet.js:182 rt_max_width: 285 rotating_tweet.js:183 Parent change: 0 rotating_tweet.js:179 Grandparent change: 0 rotating_tweet.js:180 Old box width: 285 rotating_tweet.js:181 New target width: 285 rotating_tweet.js:182 rt_max_width: 285 rotating_tweet.js:183 Parent change: -79 rotating_tweet.js:179 Grandparent change: -79 rotating_tweet.js:180 Old box width: 285 rotating_tweet.js:181 New target width: 206 rotating_tweet.js:182 rt_max_width: 206 rotating_tweet.js:183 Old tweet height: 85 rotating_tweet.js:195 Old tweet height: 85 rotating_tweet.js:195 Old tweet height: 121 rotating_tweet.js:195 Old tweet height: 103 rotating_tweet.js:195 Old container height: 121 rotating_tweet.js:202 Old height: 121 rotating_tweet.js:203 Old container height121 rotating_tweet.js:207 New tweet height: 103 rotating_tweet.js:229 New tweet height: 103 rotating_tweet.js:229 New tweet height: 139 rotating_tweet.js:229 New tweet height: 121 rotating_tweet.js:229 New height: 139 rotating_tweet.js:236 Parent change: 0 rotating_tweet.js:179 Grandparent change: 0 rotating_tweet.js:180 Old box width: 206 rotating_tweet.js:181 New target width: 206 rotating_tweet.js:182 rt_max_width: 206 rotating_tweet.js:183 Parent change: -25 rotating_tweet.js:179 Grandparent change: -25 rotating_tweet.js:180 Old box width: 206 rotating_tweet.js:181 New target width: 181 rotating_tweet.js:182 rt_max_width: 181 rotating_tweet.js:183 Old tweet height: 82 rotating_tweet.js:195 Old tweet height: 98 rotating_tweet.js:195 Old tweet height: 130 rotating_tweet.js:195 Old tweet height: 114 rotating_tweet.js:195 Old container height: 139 rotating_tweet.js:202 Old height: 130 rotating_tweet.js:203 Old container height139 rotating_tweet.js:207 New tweet height: 98 rotating_tweet.js:229 New tweet height: 98 rotating_tweet.js:229 New tweet height: 130 rotating_tweet.js:229 New tweet height: 114 rotating_tweet.js:229 New height: 130 rotating_tweet.js:236 Parent change: 0 rotating_tweet.js:179 Grandparent change: 0 rotating_tweet.js:180 Old box width: 181 rotating_tweet.js:181 New target width: 181 rotating_tweet.js:182 rt_max_width: 181 rotating_tweet.js:183 Parent change: -54 rotating_tweet.js:179 Grandparent change: -54 rotating_tweet.js:180 Old box width: 181 rotating_tweet.js:181 New target width: 127 rotating_tweet.js:182 rt_max_width: 127 rotating_tweet.js:183 Old tweet height: 98 rotating_tweet.js:195 Old tweet height: 98 rotating_tweet.js:195 Old tweet height: 130 rotating_tweet.js:195 Old tweet height: 114 rotating_tweet.js:195 Old container height: 139 rotating_tweet.js:202 Old height: 130 rotating_tweet.js:203 Old container height139 rotating_tweet.js:207 New tweet height: 98 rotating_tweet.js:229 New tweet height: 98 rotating_tweet.js:229 New tweet height: 178 rotating_tweet.js:229 New tweet height: 130 rotating_tweet.js:229 New height: 178 rotating_tweet.js:236 Parent change: 0 rotating_tweet.js:179 Grandparent change: 0 rotating_tweet.js:180 Old box width: 127 rotating_tweet.js:181 New target width: 127 rotating_tweet.js:182 rt_max_width: 127 rotating_tweet.js:183 Parent change: -15 rotating_tweet.js:179 Grandparent change: -15 rotating_tweet.js:180 Old box width: 127 rotating_tweet.js:181 New target width: 112 rotating_tweet.js:182 rt_max_width: 112 rotating_tweet.js:183 Old tweet height: 98 rotating_tweet.js:195 Old tweet height: 98 rotating_tweet.js:195 Old tweet height: 178 rotating_tweet.js:195 Old tweet height: 130 rotating_tweet.js:195 Old container height: 187 rotating_tweet.js:202 Old height: 178 rotating_tweet.js:203 Old container height187 rotating_tweet.js:207 New tweet height: 98 rotating_tweet.js:229 New tweet height: 114 rotating_tweet.js:229 New tweet height: 194 rotating_tweet.js:229 New tweet height: 162 rotating_tweet.js:229 New height: 194 rotating_tweet.js:236 Parent change: 0 rotating_tweet.js:179 Grandparent change: 0 rotating_tweet.js:180 Old box width: 112 rotating_tweet.js:181 New target width: 112 rotating_tweet.js:182 rt_max_width: 112 rotating_tweet.js:183 Parent change: -5 rotating_tweet.js:179 Grandparent change: -5 rotating_tweet.js:180 Old box width: 112 rotating_tweet.js:181 New target width: 107 rotating_tweet.js:182 rt_max_width: 107 rotating_tweet.js:183 Old tweet height: 98 rotating_tweet.js:195 Old tweet height: 114 rotating_tweet.js:195 Old tweet height: 194 rotating_tweet.js:195 Old tweet height: 162 rotating_tweet.js:195 Old container height: 203 rotating_tweet.js:202 Old height: 194 rotating_tweet.js:203 Old container height203 rotating_tweet.js:207 New tweet height: 114 rotating_tweet.js:229 New tweet height: 114 rotating_tweet.js:229 New tweet height: 194 rotating_tweet.js:229 New tweet height: 178 rotating_tweet.js:229 New height: 194 rotating_tweet.js:236 Parent change: 0 rotating_tweet.js:179 Grandparent change: 0 rotating_tweet.js:180 Old box width: 107 rotating_tweet.js:181 New target width: 107 rotating_tweet.js:182 rt_max_width: 107 rotating_tweet.js:183 Parent change: -8 rotating_tweet.js:179 Grandparent change: -8 rotating_tweet.js:180 Old box width: 107 rotating_tweet.js:181 New target width: 99 rotating_tweet.js:182 rt_max_width: 99 rotating_tweet.js:183 Old tweet height: 114 rotating_tweet.js:195 Old tweet height: 114 rotating_tweet.js:195 Old tweet height: 194 rotating_tweet.js:195 Old tweet height: 178 rotating_tweet.js:195 Old container height: 203 rotating_tweet.js:202 Old height: 194 rotating_tweet.js:203 Old container height203 rotating_tweet.js:207 New tweet height: 114 rotating_tweet.js:229 New tweet height: 114 rotating_tweet.js:229 New tweet height: 194 rotating_tweet.js:229 New tweet height: 178 rotating_tweet.js:229 New height: 194 rotating_tweet.js:236 Parent change: 0 rotating_tweet.js:179 Grandparent change: 0 rotating_tweet.js:180 Old box width: 99 rotating_tweet.js:181 New target width: 99 rotating_tweet.js:182 rt_max_width: 99 rotating_tweet.js:183 Parent change: -5 rotating_tweet.js:179 Grandparent change: -5 rotating_tweet.js:180 Old box width: 99 rotating_tweet.js:181 New target width: 94 rotating_tweet.js:182 rt_max_width: 94 rotating_tweet.js:183 Old tweet height: 114 rotating_tweet.js:195 Old tweet height: 114 rotating_tweet.js:195 Old tweet height: 194 rotating_tweet.js:195 Old tweet height: 178 rotating_tweet.js:195 Old container height: 203 rotating_tweet.js:202 Old height: 194 rotating_tweet.js:203 Old container height203 rotating_tweet.js:207 New tweet height: 114 rotating_tweet.js:229 New tweet height: 114 rotating_tweet.js:229 New tweet height: 194 rotating_tweet.js:229 New tweet height: 178 rotating_tweet.js:229 New height: 194 rotating_tweet.js:236 Parent change: 0 rotating_tweet.js:179 Grandparent change: 0 rotating_tweet.js:180 Old box width: 94 rotating_tweet.js:181 New target width: 94 rotating_tweet.js:182 rt_max_width: 94 rotating_tweet.js:183 Parent change: -4 rotating_tweet.js:179 Grandparent change: -4 rotating_tweet.js:180 Old box width: 94 rotating_tweet.js:181 New target width: 90 rotating_tweet.js:182 rt_max_width: 90 rotating_tweet.js:183 Old tweet height: 114 rotating_tweet.js:195 Old tweet height: 114 rotating_tweet.js:195 Old tweet height: 194 rotating_tweet.js:195 Old tweet height: 178 rotating_tweet.js:195 Old container height: 203 rotating_tweet.js:202 Old height: 194 rotating_tweet.js:203 Old container height203 rotating_tweet.js:207 New tweet height: 114 rotating_tweet.js:229 New tweet height: 114 rotating_tweet.js:229 New tweet height: 194 rotating_tweet.js:229 New tweet height: 178 rotating_tweet.js:229 New height: 194 rotating_tweet.js:236 Parent change: 0 rotating_tweet.js:179 Grandparent change: 0 rotating_tweet.js:180 Old box width: 90 rotating_tweet.js:181 New target width: 90 rotating_tweet.js:182 rt_max_width: 90 rotating_tweet.js:183This stays the same when the screen is re-sized back to full screen. Hope this helps.
There appears to be both a CSS and a Javascript issue here.
The tweets should be visible even after shrinking. By the end of all that Javascript, Rotating Tweets thinks the box containing it is 90px wide – so it should be visible somewhere.
How are you handling the responsiveness? Is it all done via CSS? Or is there some javascript as well?
Could you send me the stylesheet and/or JavaScript so that I can try and understand the issue?
The topic ‘Rotating Tweet – Collapse Issue’ is closed to new replies.