How to fix internet explorer column widths - javascript

I'm working on a project for my school where the courses, teachers and clasroomnumbers are appearing for the signage TV's.
The start of the project was made by the company who make's our software. The only thing I can do now is change some things with javascript. These changes are working fine in Chrome and Firefox. However I need it to work in Internet Explorer.
You could go to this link to see what happens:
https://www.miras.be/lokaal_bezetting_lijst/57/2019-09-26/08:00/22:00/
When you open in Chome or Firefox it works perfectly
When you open in IE, you see that the hours are not well displayed.
--> Strange manual solutions: When I refresh the page or do something that resizes the window, it does work.
Bad view:
Good view:
Does anyone know a javascript/jquery solution for this?
Thanks in advance!
Laurent

If you want the table column width always fixed you can use
MIN-WIDTH and MAX_WIDTH on the same column. If you will you the both property with width than table column will always same.

After a long search I've found the solution. As I've mentioned, it becomes ok when I resize the window. With this event at the end of my script everything was fixed. Thanks for the answers and help!
$(window).trigger('resize')

Related

Fix specific links in website not working on iphone only

I'm creating a website from this template and I've downloaded the template and uploaded it without modifications here.
I have this problem (confirmed by a ticket on templatemonster): on Iphone only (seems like both on safari and chrome), i cannot click on some links (e.g. "view charateristics" on the 4 boats images under "YACHTS FOR SALE".
I tried editing it:
adding a big z-index on the tags
creating a custom section with bootstrap and custom link
using <span> tags with onclick="window.location.href='test.php'"
using a <form> and a <button>
It really seems that the browser does not "catch" the click on the element.
But still, none of them work.
Unluckily, i cannot test on a real phone, but this simulator https://appetize.io/ seems to work pretty well. I did confirm that the problem is also on real devices, thanks to a customer.
I would like to know if anybody knows to fix this issue, without making the template look much different, thanks
EDIT
Here's the page where i'm trying to fix the bug. As you can see the <ontouchstart> is also not working.
I don't know if it would help, but you can also see that the carousel is not working on iphone (not a problem itself, i'm going to hide it).
It's a known Safari Mobile bug, you should add the ontouchstart event handler
More infos here

Owl Carousel displaying different and wrong on refresh

I have an owl.carousel on my website displaying testimonials. I didn't have any issues with this until about a month or two ago. I have no idea what happened that now I have this problem but i'll try to explain as best as I can.
I'm getting two different views of the carousel on the firefox and chrome. On firefox, it looks perfectly fine and displays correctly. On chrome how ever, it seems like after the browser cashes the page, the carousel decides to align all the text to the right (I know this is confusing so ill put picture in so you guys can see). The reason I say after it cashes the page is because, when I load the page with no cashe on chrome, it looks perfectly fine as it does on firefox, but as soon as I go to another page and then come back or refresh the page, the carousel all shifts to the right.
Here is what it looks like on chrome:
https://gyazo.com/2466dc69c470851122693d622975c018 --> Chrome
Here is also a link to the website for who ever that wants to read the code them selves (scroll down the home page and you will see the testimonials section):
http://ecocertificates.com.au
Any help would be greatly appreciated guys!
Thanks in advance :)

Gif animation freeze in mac safari

I am working on this site "http://tinyurl.com/joblnmd". On home page there'gif animation, I've used preload method to load images, its working on all major browsers expect safari on Mac.
Is this bug in safari or is there any hack?
New Post: I've looked at the site again and there doesn't seem to be any problems. The loading hourglass appears for a long time, but it eventually disappears and the main content of the page is visible. It might be best for your to provide a JSFiddle with just the area in question so that I, or someone else, can have a proper look and help you solve your problem.
Old Post: Maybe you need to update your browser. My Mac Safari appears to show everything perfectly. But I'll check again later tonight. The animation looks very nice.

When "zoom in" at Facebook, the chat sidebar got hidden, but how?

I am not sure does anyone notice that Facebook can detect users zoom-in level when it hits a level, it will dynamically add .hidden_elem classname onto .fbChatSidebar to hide it. (Check the attachments below)
I have searched a lot about this feature and found the repo in github called detect-zoom, but it seems that there are still some problems especially in latest version of FF & Chrome.
So I am really curious about how does Facebook detect this with JavaScript and I have tried it with latest FF & Chrome and it seems that Facebook can detect it correctly and hide the sidebar at the right zoom-in level.
Does anyone know anything about how they implement this feature ? or even possible solutions are welcome.
Thanks.
I'm not sure about the exact solution Facebook is using but I discovered they hide the sidebar on both window resize and zoom.
My research shows that all browsers, including IE8 and up fires the window.resize event when zooming as well. So by setting some breakpoint when you wish to hide something you should be able to implement some similar functionality.
Quick and dirty example: http://jsbin.com/ofufer/1/

SharePoint 2010 Context menu stop working until page is refreshed

Problem: Using SharePoint 2010 in IE 8; the default context menu like document library items menue works only once on each page then stop responding unless the page is refreshed.
The status bar error shows - "Javascript:;" and nothing else.
Java scripting is enables in IE, the sharepoint portal is in trusted sites.
What could that be? Any hints?
Thanks,
Val
Have you tried changing the zoom size? I have had a similar problem with list items and was able to recreate it when the zoom setting was set to 125 %. The problem went away when I set the zoom setting to 100 %. This is odd and unexpected but it worked...
Another approach/test would be to see if this problem occurs with IE 9.
I had the exactly same problem, and after some hours of search, I finally found that it comes from the ToolbarType parameter of my XsltListViewWebpart.
Set on Standard, I have the problem, but if I set FreeForm, it works !
I think it is a bug of SharePoint 2010.
Hope this will help.
Some articles that helped :
Here is an article
Another one
A last one
The solution in my case (Just setting the ToolbarType was not enough, I had to Apply the changes on the webpart)

Categories