Okay so I've been looking around for this and I cannot find it. I am looking to make the white glow that streams across the top of the tab in Google Chrome. It notifies a message in Facebook or google+. It's similar to window's glowing taskbar icons, except it's in browser. I know about desktop notifications, but those are too intrusive. I am looking for a way to call that with javascript or jquery. Thank you
The glowing tabs are relatively new features in Chrome, and are not something you can call/run directly. The implementation varies across operating systems (for example, in Windows 7 there is no "glow" as you mention).
The effect happens when the title of the webpage is changed. You change the title with javascript:
document.title = "This is the new page title.";
See this post for further clarification: https://productforums.google.com/forum/#!msg/chrome/33rVaX7pmRE/arl1bLL98XkJ
Related
When you open a website in LinkedIn's app (iOS), html5 background videos set to autoplay do not play, and animations do not fire unless you stop scrolling. So, it often looks like there is a bunch of empty space when you use fade and slide animations.
Here are a few examples (you must view within LinkedIn's app to see the issue)...
Background video
https://jobs.netflix.com/
https://thelovinggroup.com/ (also has animation issues)
Animations
https://voidwatches.com/
http://www.clearmotion.com/
Any thoughts on how to tackle this issue until LinkedIn builds a better browser?
I've looked into browser detection as a possible solution. Thinking maybe I could do an if/else statement to check if it's a common browser (Chrome, Safari, Firefox, etc.), else do something else with those videos and animations.
But everything I've read for browser detection strongly recommends against using it unless you absolutely have to (https://developer.mozilla.org/en-US/docs/Web/HTTP/Browser_detection_using_the_user_agent).
Any thoughts would be very much appreciated!
UPDATE
Ok, so I've implemented the code from this Github project to detect UIWebView: https://github.com/simpleweb/UIWebView-Detect
And it works well! However, I really need to differentiate between LinkedIn and other apps with WebView because LinkedIn is the only one with these issues.
I used Udger's parser (based on what I found in another Stack Overflow post): https://udger.com/resources/online-parser
And I can see that Facebook has its own browser, but LinkedIn seems to be using some version of Safari.
I feel like I'm starting to get closer, but I'm still not sure I've come up with a solid solution.
If I'm watching my website on my PS4 browser on my TV, the text is very small (probably because the tv is 1920x1080) - but I actually want it to format, as if it was on mobile (filling the whole screen to be readable from my sofa).
Is there a way to check if the website is displayed on a tv-screen?
(It could be through chromecast as well)
You could check for a special user agent in your TV's browser by going to a page like this (http://mybrowserinfo.com/detail.asp).
Then you can use the data-useragent and data-platform attributes to selectively apply CSS (see an example here: https://css-tricks.com/snippets/javascript/add-data-attribute-of-user-agent/).
I'm doing some iPad optimization work on this test URL:
http://www.cherrystoneauctions.com/test
However, I notice that the Google Translate menu at the top-right is not working on my iPad. I can display the list of languages, but if I touch one of them, the menu disappears and the language selection is not made.
I would have thought Google's code would work on iPad. Is there something I am doing wrong (or that I can correct) or is this a limitation of Google Translate?
The Google Translate element requires Flash to work. As iOS devices do not have Flash, this will not work by design.
Source
Additionally, I was able to further verify this functionality by successfully using the element using the Puffin Free web browser, which is a Flash-enabled browser.
I am developing a web-based database that needs to be opened through firefox web browser(because of some css3 elements). I want the page to open automatically in full screen mode. I dont want the user of the database to have access to the firefox menu items
Can't be done if you just have control of the webpage. Controls in the webpage cannot cause changes in the browser instance itself.
It would be a security issue if that were allowed. You could look into writing a Firefox extension to do that, as they have more access to the browser instance itself.
You shouldn't look at trying to hide the firefox menu controls. That seems like a flaw in your problem-solving approach.
You will want to look at Fullscreen APIs of the browser. If you accept a small request/info to the user in the application it can be done quite easily. You just can't force the user into Fullscreen mode against his will. This is good (for security reasons).
http://hacks.mozilla.org/2012/01/using-the-fullscreen-api-in-web-browsers/
I'm the processing of redesigning a website that uses hover effect on a button (like button images changes when you put your mouse over it and when you click it, it goes to a different page).
Now that works fine if you're on a a desktop/laptop computer. But on a tablet, the hover/onmouseover effect does not work. On a tablet, when clicking the button image, it changes briefly and then immediately goes to a new page.
What are methods and techniques where a website can detect if a visitor comes from a tablet or not? Then would it be possible to switch to a tablet CSS version? Or, are there tablet framework (i.e. Modernizer?) that can help with this process?
Touch devices don't have a hover event and there is no way to emulate the user interaction that might initiate it. Make sure that there is no critical functionality assocaited with hover events (most just do highlighting) so there is no loss of functionality if the device doesn't have it. Browser sniffing by UA string is a flawed strategy - you must update it every time a new device comes along or the string changes for an existing device. Great if you're into high prices for maintenance, but not if you're the one paying for it.
You could identify the iPad (or mobile device) simply by checking the User-Agent parameter of the browser.
In PHP for example you could do something like:
if( strstr($_SERVER['HTTP_USER_AGENT'],'iPad') ) { // Add custom iPad CSS }
If you want to get it further you could use WURFL (http://wurfl.sourceforge.net/)