FAQ Database Discussion Community


Javascript .Focus causing safari 8.1.3 to crash only on IPad

javascript,ios,ipad,safari
Web App Technology: Asp.Net 4.5 The following snippet of javascript causes Safari (update 8.1.3) to crash. However it worked fine on the previous safari version. The code just resets focus to control after server request. Note: this works fine in Chrome, IE, and FF. var TFoc_Id function EndRequestHandler() { try...

Detect mouse button event on movement in query

jquery,google-chrome,firefox,safari
I'm trying to detect whether a mouse button is already pressed if it moves over an element. In safari, the mouse event changes if buttons are pressed. Firefox doesn't. This fiddle/snippet explains it better : In Safari/Chrome the boxes turn blue when rolled over (event = 0), but turn red...

Safari: Can't find variable: HTMLUnknownElement

javascript,dom,safari
According to MDN, HTMLUnknownElement is supported by all browsers including Safari: https://developer.mozilla.org/en-US/docs/Web/API/HTMLUnknownElement. But I am getting Can't find variable: HTMLUnknownElement when I test myVar instance of HTMLUnknownElement. Also just typing HTMLUnknownElement in Safari (hard to find) console and pressing enter throws this error. I am using latest Safari 5.1.7 on...

@supports (-webkit-flex-wrap: wrap) doesn't return true when Safari does support it

css,css3,safari,flexbox,browser-feature-detection
I am using Safari 7.x. I have the following feature query which always returns false. @supports (-webkit-flex-wrap: wrap) { } What syntax do I need to use for this to return true when safari does understand -webkit-flex-wrap?...

Img not showing in Safari, does show in Chrome

html,css,image,google-chrome,safari
I feel like I'm missing something here. I've got a website for a client where the images show up perfect in Chrome and just fail to appear entirely in Safari. I'm using only HTML and CSS. Any ideas? The live site is at angelahartley.net HTML: <ul class="gallery"> <li><img src="img/home1.jpg" title="newborn...

Why won't this URL work in Safari?

safari
This works in Chrome and Firefox and IE, but not Safari on OSX. Any way to get around it? "There is no application set to open the URL username:[email protected]" http://username:[email protected]..

Function doesn't work in safari on windows

javascript,jquery,html,safari
While this syntax works on all other browser, safari on windows throws an error $("#kibana").contents().find('.navbar-nav')[0].remove(); The error is TypeError: 'undefined' is not a function The element does exist. I checked using the debugger. Why is this happening?...

iOS - Return to Safari from Native App without Opening New Tab

ios,tabs,safari,native
I am having trouble figuring out how to switch to Safari from a native app in iOS 7+. I've used UIApplication.sharedApplication.openURL(), but that opens a new tab. I would like to return the user to the current page he/she was viewing before without opening a new tab. I found this...

How can I make an HTML input element in a WAI-ARIA tree accessible to VoiceOver in Safari?

html,safari,accessibility,wai-aria,voiceover
I want to put an <input> element inside an element with role="tree" like this: <div role="tree"> <div role="treeitem"> <h1>Tree Input</h1> <input> <a href="#">Submit</a> </div> </div> However, when I do this, I am unable to access the <input> element using my screen reader – VoiceOver in Safari on OS X. When...

Javascript error only on Safari

javascript,jquery,safari
I've a javascript that works well in all browser but Safari. The code is pretty easy and basically when I change the value of a text field (numeric value) the content of a <b> is changed Here the code $(document).on('change', '.priceAmount', function(e) { e.preventDefault(); $((e.target).closest('div.price_info')).find('> .supplierPrice').html( ($(this).val() + 10); });...

Images Distorting in Safari

css,safari
When I hover over the images on the below page in Safari they will distort for a split second: http://bit.ly/1zEqV3Q It only seems to happen after the small thumbnails slide down. Does anyone know why this is happening in Safari?...

CSS Transform property not working in Safari correctly

css,safari
I have a website that I'm re-designing and one of the problems I'm having is that when i use #cssmenu ul { -webkit-perspective: 600px; -moz-perspective: 600px; perspective: 600px; -webkit-transform-style: preserve-3d; -moz-transform-style: preserve-3d; transform-style: preserve-3d; } It seems to act up only in Safari. It's making the perspective go slanted. Does...

:not(:checked) selector in safari 5 inconsistant results

jquery,html,safari
I have a bunch of checkboxes. some of them start off checked using the checked attribute. When you check something previously unchecked, or uncheck something previously checked, I am styling it differently so the user can see which checkboxes changed. In Safari 5 I am using this selector: [checked]:not(:checked), :not([checked]):checked{...

moz box shadow option not reflecting in safari browser [closed]

javascript,css,safari
box-shadow effect is not working in my safari 5.1.7 I have tried with -moz-box-shadow and -webkit-box-shadow also.. but safari is not even showing that options. How to get box-shadow effect??...

Angular.js mobile browser app freezes on iOS 8 Safari

javascript,ios,angularjs,safari,freeze
Our Angular.js Web App sometimes freezes on iOS8 Safari. When this issue happens, the ng-click callback is not triggered. If you replace ng-click with a regular javascript onclick, it would work. It doesn't happen in Chrome on iOS8 devices. Has anyone else noticed this issue on iOS8 Safari or has...

How can I get the current state of my div animation?

html,css,safari,styling
I am using Safari, thus to make it easier to answer my question I will just use the -webkit- prefix on my animations. I am making a menu that is in the corner. When the user hovers, it spans the entire website until the user leaves the menu, then it...

Button not center align in Safari

html,css,safari,center-align
Button not centered align in Safari browser JSFIddle HTML <div class="" style=" width: 100%; "> <input value="Button" class="center-block" type="submit" style=""/> </div> CSS .center-block { display: block; margin-right: auto; margin-left: auto; } Above problem just come in safari, in chrome and firefox it is ...

CSS transition is not working in Safari

css,safari
When you hover over image1div, it scales to 0.95 and fades to 80% opacity. It works in Chrome and Firefox but not Safari. It fades and scales instantly in Safari rather than smoothly in 0.5s. .image1div { width: 350px; height: 350px; margin-top: 0px; float: right; background-color: #5a89ad; background-size: cover; filter:alpha(opacity=100);...

Safari 8 not for windows?

safari,cross-browser,indexeddb,pouchdb
I'm trying to execute my program cross-browser and I found that Apple's Safari for windows ends with version 5.1.7! But when I searched all over the internet to acquire Safari 8, I found that they had no support for windows. I very badly want Safari 8 for windows since it...

Firebase push gave me SyntaxError: invalid object initializer

javascript,jquery,ios,safari,firebase
so I am experiencing some very strange problem. I am trying to connect to my firebase and push results to 'surveyAnswers' and it does work in chrome ( ios ) but doesn't work on firefox/safari ( ios ). Here is code which make problem - surveyAnswers.push({answers}); And here is 'complete'...

“linear-gradient” not working in IE9 and Safari

html,css,css3,internet-explorer,safari
I try to apply a style to a button but this style displays well on Mozilla and Chrome then it is not the case for Safari and IE9. Here is the css class: #bt_D{ width:130px; height:30px; box-shadow:1px 2px 4px rgba(0,0,0,0.60); font-size:12px; background-image:linear-gradient(60deg, rgb(231,110,49), rgb(231,171,49)); border:1px solid rgb(180,180,180); border-radius:5px; float:right; text-align:center;...

Margin not working only in Safari (element is at the bottom of the page)

html,css,safari
Please check the following link in the latest safari: http://www.grupoguion.com/ The footer is fixed at the bottom and supossed to revealed with the scrolling, so the previous section has a margin-bottom but it doesn't work, only in Safari. Everywhere else is ok, even in I.E. I tried to add overflow:...

Safari jQuery on('drop') not working with files

javascript,jquery,safari
I am trying to drop files into a folder on my website. It works in chrome perfectly but the event does not fire in safari. I can seem to get the drop event fired through files. Although it works if I drag and drop elements in the website. $(document).on('dragstart', '.mtdrg',...

PHP sort not working in Chrome and Safari

php,google-chrome,safari,webkit,bxslider
I am not sure if it is the sort that isn't working or the way that I am outputting the information. But it would seem that the order that these "li" elements are being made is wrong sometimes. The images in the folder are named something like A-Mike-groomsman-topRight-light.jpg B-James-groomsman-topRight-light.jpg C-Jared-groomsman-topRight-light.jpg...

primefaces push not working in Safari using AWS Tomcat7

tomcat,primefaces,safari,websocket,push
I am using PrimeFaces 5.1, JSF 2.1 and tomcat 7 and my application is in AWS. atmosphere version 2.2.2. I am not able to use push functionality in Safari 5.1.7. We have configured the AWS to enable push based on Primeface push with AWS , Websocket with Tomcat 7 on...

Using a web browser read system time, display data and write configuration data from a USB Mass storage class

html,google-chrome,safari,mozilla,usb-drive
I've an embedded system which runs firmware and has USB mass storage with size 79kB. So when you plug in the device to any computer(MAC/Windows), it pops as a 79kB flash drive. The firmware creates files which has transaction records. The objective is to display these transactions (tables and simple...

Polymer Project not working on Safari

safari,polymer,compatibility,platform,material
I'm developing a websites using Paper/Core Elements with HTML Import of Polymer Project. As subjested in some post about Polymer and Polyfill, I have imported 'webcomponents.js' that matches to 'platform.js'. That solved my problem partially, only for Mozilla Firefox and Internet Explorer. On Safari its not still working. I'd like...

Namespace prefix NS1 for href on %tagElement% is not defined, setAttributeNS

svg,safari,namespaces,xml-namespaces,setattribute
I got this error in safari while trying to convert svg to base64 url via code: $svgCopy = $('svg').clone() html = $('<div>').append($svgCopy).html() imgSrc = 'data:image/svg+xml;base64,' + btoa(html) imgEl.src = imgSrc The problem is that when you set attribute with NS (setAttributeNS) safari sets NS\d+ namespace and do not sets xmlns:NS\d+...

Keyframe Animation only working in Internet Explorer

html,css,google-chrome,safari,keyframe
I am trying to add this scroll animation script to my website: http://codepen.io/zutrinken/pen/yhqEA #scrolldown { bottom: 40px; height: 100px; margin-left: -50px; position: absolute; left: 50%; text-align: center; width: 100px; z-index: 100; } #scrolldown p { font: 700 0.7em/1em 'Avenir',sans-serif; animation-duration: 2s; animation-fill-mode: both; animation-iteration-count: infinite; animation-name: scroll; color: #000; }...

Buttons in ion-footer-bar are overlapping

css,safari,ionic
I am try to use Ionic ion-footer-bar to show three fixed buttons and unlimited other scrolling buttons: However, the fixed icons are overlapping each other, in Safari. The code is on: CodePen How can I have the blue buttons layout properly?...

Inspect an app from ipad using Safari Web Inspector

ios,safari,worklight,web-inspector
I want to use Safari web inspector in order to inspect an ipad application which I developed using eclipse and worklight. Obviously when I connect my ipad with the mac, i go to safari--->develop--->ipad--->no inspectable applications. When I open the app in safari (as a web page) it works but...

Bootstrap data-toggle not working in Safari

jquery,twitter-bootstrap,safari
The below code making use of bootstrap's data-toggle="collapse" to do the functionality of collapse/expand on click of configured element, In this case, clicking parent1 and parent2 Problem: On click of parent element, the collapse is working from my PC using Chrome and firefox browsers, but it is not working from...

IOS Safari transition transform not working

ios,safari,css-transitions,css-transforms,vendor-prefix
Whenever I seem to apply some code to let's say move a div for example using the latest iOS Safari browser it doesn't actually transition between the two rules set. I have tried changing to use other than percentage values but still to this day, I have never been able...

Vertical centre positioning trouble in Safari

css,safari
I'm having some cascading style issues here - when height of screen is smaller than 680px it works fine (position is added absolutely, because my client is against responsiveness of his website), but when it's big position of <div class="container"> tag should be relative / vertically in center of page....

Javascript onchange(this.value, that.value) not working on ipad

javascript,php,jquery,google-chrome,safari
I have this code which works perfectly on PC but it doesnt work on my iPad ( i assume it doesnt work on any mobile either). I have tried with Safari and with Chrome without any luck. HTML : <input name="Service" type="radio" value="110" onchange="update_cart(this.value, Service2.value )" /> <input name="Service" type="radio"...

Safari: vertically center div inside a fixed div

html,css,safari
I'm currently having an issue that is only appearing in safari (have not tested in IE yet though). I am creating a lightbox of sorts, where there is a full sized fixed container, and a fluid inner div. The issue is that in safari, the inner container is at the...

Bordered element with display:table extends out of parent

html,css,google-chrome,safari
This code seems to have a different effect in each browser. .container { display: inline-block; border: 1px solid black; padding-top: 5px; padding-bottom: 5px; } .box { display: table; width: 10px; height: 10px; background-color: red; border: 5px solid blue; } <div class="container"> <div class="box"></div> </div> In Chrome 43.0, the table is...

Elements with position: relative with SVG clip paths not displaying in Safari

css3,svg,safari,css-position,clip-path
I have a web page in which I am using an SVG clip path applied to one of the page's HTML elements. SVG element: <svg height="0" width="0"> <defs> <clipPath id="clip"> <path d="M150 0 L75 200 L225 200 Z" /> </clipPath> </defs> </svg> HTML element the clipping path is applied to...

Why can Chrome get file, but not Safari?

node.js,http,web,safari,xmlhttprequest
The URL Open this url in Chrome is all fine, but when open it in Safari, some files can't get forever. OK in Chrome: BAD in Safari: As you can see, all plist file and ExportJson file can't get in Safari. But they all exists in server. Like faceshow_10.plist, it's...

Safari svg gaussian blur (feGaussianBlur) wont render stdDeviation less than 1?

svg,safari,webkit,svg-filters
A complex logo I'm rendering shows artifacts between the different shapes. These are not gaps in the artwork, but aliasing artifacts. I found a good solution for removing these artifacts, being to mask the object and apply a very slight gaussian blur (feGaussianBlur) with a low stdDeviation value (0.125). Chrome,...

Chrome & Safari Absolute Div Display Issue

html,css,google-chrome,safari
For some reason when you go to the homepage of my site: bluestarnj.com on chrome or safari the top of the page is cut off. This only occurs on laptops with small browser heights. It renders perfectly fine in firefox. Now if I tell it to position itself 300px from...

Safari open and close img MIME type multipart / x-mixed-replace streaming on demand

javascript,dom,safari,multipart,mjpeg
testing a mobile Safari web application, I find that I have an image in your tag img src changes dynamically. This src reference to a url that generates a streaming mjpeg with MIME type multipart / x-mixed-replace. Changing the src notice that the browser does not close the connection to...

'This file cannot be downloaded' when trying to access ics file in homescreen web app

javascript,ios,web-applications,safari,homescreen
I have a web app where, when user submits a form, iCalendar .ics file is generated server-side and sent back to client with following headers: 'Content-type': 'text/calendar; charset=utf-8', 'Content-Disposition': 'inline; filename=calendar.ics' While doing this on iOS in Safari browser, the file is processed correctly (event is added to Calendar), but...

Safari canPlayType() marks .ogg as “probably” & HTML5

javascript,html5,safari,mobile-safari,html5-audio
I want to create a html5 audioplayer for my band's website. The audiofiles are stored in the database as mp3, ogg and wav files to support all major browsers on their current versions. First, all audiofileversions for one audiofile are loaded into the html: <audio class="song-preview" preload="none"> <source type="audio/ogg" src="/preview/trees/trees/OG/DT/OGG"></source>...

Alternative to calc()

html,css,html5,css3,safari
I have a container with auto-width and some margin left and right: .inner { margin-left: 20px; margin-right: 20px; width: auto; } And in this container different elements. Some elements should be 100% of the page (without the margin) and for that I use calc(): .fullwidthelement { left: -20px; width: calc(100%...

Sqlite + Safari History.db

database,sqlite,safari,browser-history
Recently Safari moved from History.plist to History.db to save history information. I tried opening the .db file with a SQLite DB Browser - but strangely nothing happened. Does anyone have a clue what file format this would be - or whether it's encrypted?

Why on Safari the transform translate doesn't work correctly?

css,safari
I often use this code to center a div in view: .centered { position: fixed; top: 50%; left: 50%; /* bring your own prefixes */ transform: translate(-50%, -50%); } It works great on Firefox, Internet Explorer and Chrome, however not in Safari. What's a workaround to center an image in...

How Pocket put their saved message above Safari

ios,iphone,xcode,safari
My question is about how Pocket actually put their "saved" view above the Safari view. You can see it happen in this video. Did they actually have access to put their view in Safari's view? Or is Safari in charge of this view? I am talking about this ...

Website not displaying correctly in Safari and Chrome

javascript,html,css,safari,rendering
I'm a complete newbie here. I have been trying to learn to code a site with HTML/CSS/JAVASCRIPT. I am using brackets to code the site. The site I am practicing with renders properly with all css and javascript. However when I open the .html file into safari or firefox it...

Float bug in chrome and Safari

css,google-chrome,safari,css-float
I'm getting a really strange bug in chrome and Safari only. I have a section with 3 divs inside. I want them to be put side by side, so I put a float left on the first one, a display inline-block on the middle one and a float right on...

2 divs in one row in Safari [error]

html,css3,safari
I'm a having a little problem trying to put 2 divs in one line in Safari. It's just an HTML for a test (http://www.despegarboido.byethost22.com/) The problem is that when I open it on Safari, all of my rows collapse into the same column. My html looks something like this: <div...

Skrollr animation flickering in safari. What am I doing wrong?

animation,safari,skrollr
While scrolling down through a image animation it flickers between each image. When scrolling back up and starting over, the flickering goes away. Works perfectly fine in Chrome and Firefox. Heres the code structure: HTML <div class="container" id="arena"> <div id="animate" data-anchor-target="#arena" data-smooth-scrolling="off" > <img class="lazy" src="img/animations/ctu_hq_animation_mb_4.0001.png" alt="" data-0-top="display:none;" data--100-top="display:block;" data--125-top="display:none;">...

On iOS Safari, using radio button to toggle dom breaks radios/checkboxes

jquery,ios,safari,radio-button
The following code works fine on all browsers except Safari on iOS (haven't tested android yet). Simple enough concept. When the user clicks a radio option, I toggle a class to change which additional fields are shown. Works the first time, but after I change it once, all the radio...

CSS Transforms not working in Safari? Anybody know a work around?

css,html5,safari
I've been dealing with this problem for a week now. I'm re-designing a website, and i just finished the vertical navigation. Everything works perfect except when i view the website in Safari. The transform 360 becomes slanted, and it's hard to read the text. Does anybody know how i can...

Java exception detected in safari but not detected in IE?

java,internet-explorer,nullpointerexception,safari
I have a java applet code that works fine when it's opened from IE, but if it's opened from Safari, Java console produces a nullpointerexception. The code that generate this behaviour is shown below: public class MsgBoxPanel extends JDialog { Panel panel1 = new Panel(); JLabel label1 = new JLabel();...

Masonry layout bug on Safari, using a Wordpress site

javascript,wordpress,safari,masonry
I'm stumped. I use Masonry on my Wordpress site, and it looks fine on all major browsers except for Safari. Here is an article link, for example: masonry article about apple watch on a wordpress site On Safari the div items are all squashed up, and I have no idea...

Safari webpage layout messed up

html,css,safari,frontend
I have been working on this for a few days now. I cannot seem to get my website to display correctly in Safari (desktop or mobile) but it works in IE, Chrome, Firefox, and Opera. I am not too worried about the mobile yet; taking it one step at a...

Accessing SVG children in Safari

javascript,svg,safari
I load a SVG file with ajax and pass the SVG to a javascript function like this: var svg = $(xml).find('svg'); map.addSlopeLayer(svg[0]); Inside the function I access the children of the SVG: var gs = svg.children; This works fine in Firefox and Chrome but when I try it in Safari...

How to open a website on UIWebview as computer?

uiwebview,safari
On Google Chrome there is this option "Website for computer". Many websites recognize that your are using mobile phone and they redirect you to another website made for mobiles. I just need to don't let them to recognize that I'm using a UIWebview from IOS....

Safari doesn’t detect my extension certificate [MAC]

safari,certificate,safari-extension
I have registered for the Safari Development Program and have a valid Apple ID. I've followed all the steps given by Apple. I have the Safari Extension Certificate (the .cer file) but when I open Safari's Extension Builder, my certificate does not appear there. I need Reputation for upload image......

toLocaleString() doesn't work in Safari browser

jquery,safari,comma,money
I used toLocaleString() method to input money comma in `javascript. But the problem is, IE and chrome browser result correctly except Safari browser. I delete cache several times but still doesn't work. Can you help? ;) var test = 12300; console.log('test:'+test.toLocaleString()); // 12,300 in IE,Chrome // 12300 in Safari ...

Issue with window.print on Safari

javascript,jquery,printing,safari
I have a page that has some content to be printed. At the moment of the printing, some divs must be hidden and just one must appear. The code works fine on Chrome, Firefox and IE, but not on Safari. Here is my JS: $(".printButton").on("click", function (event) { event.preventDefault(); $("form").attr("style",...

Flexbox not working in Safari

css,html5,css3,safari,flexbox
The layout I am creating isn't working in Safari though it works perfectly in Chrome. I have a feeling it has something to do with the .wrapper or the .frame but I have tried setting the Flex Shrink value to 0 to no avail. JSFiddle .frame { display: -webkit-flex; display:...

webkit transition rule not working at all in Safari

css,css3,safari,css-transitions
I have the following CSS transition rule: .headroom { -ms-transition: transform 200ms linear; -webkit-transition: transform 200ms linear; transition: transform 200ms linear; } But latest version of Safari (8.0.6) is not detecting the transition rule: Why? What am I doing wrong? ...

Photo gallery lagging in OS X Safari

javascript,html,safari
I wrote this photo gallery to show some photos with autoplay. (The autoplay stops when the user selects a photo manually) I'm experiencing some lag in OS X Safari (scrolling isn't smooth anymore). OS X Firefox and iOS Safari are fine. Does anyone know why this is lagging and how...

HTML5 audio player not working with jQuery on Safari or IE

jquery,html5,safari
I am triggering HTML5 audio player with jQuery when clicked on an object. Everything works fine in chrome or firefox but it is not working in safari 8 or in IE 10. It is also not working in IOS 8. <audio class="player-audio" src="http://spellout.org/resources/audio/int-icao/alfa.ogg"></audio> <a class="play-audio" data-audio="alfa"><h6>Play Audio</h6></a> $('.play-audio').click(function(){ var audioPlayer...

Image height in safari

html,css,safari
I have a problem with some image in safari. It is working everywhere but not in safari. I've some images on my site but on safari the image's are going way to high. The website is development.mar-bakker.nl <div class="col-xs-12 col-sm-4 col-md-4"> <div class="grid wow zoomIn"> <figure class="effect-bubba"> <img src="assets/images/item-2.jpg" class="img-responsive"...

Grab URL From iOS Safari

ios,objective-c,safari
My issue is I need to find a way where I can have my action extension run in Safari and open up the website currently being viewed in Safari in my app (my app is a special web browser). Here's a screenshot: When the rED extension is clicked, the extension...

Scroll div to the top doesn't work on Chrome/Safari

javascript,google-chrome,safari
I have a div that has independent scrollbars. At some point, I'm trying to make it scroll to the top of it's container by using this line: document.getElementById('page-content').scroll(0,0); That works great on Firefox, but not on Safari/Chrome. It says that scroll is undefined If I just use scroll(0,0); Then it...

Why do checkboxes move when checked in Safari?

css,forms,checkbox,safari
I have a series of values with checkboxes pre-checked on this page. The look and work fine in all browsers, except Safari. When I click on any of the checkboxes they 'jump' or 'drop' down and then move back into position. I did some research, but I didn't find anything...

Weird CSS Transition Issue

html,css,css3,safari,css-transitions
I'm using transition property in CSS in the navigation on my website. The navigation consists of 3 images. When you hover the image with the mouse, a transition is applied that displays an overlay with some text. This all works beautifully in Chrome and Firefox. Safari, however, is a mess....

jQuery - $.each on SqlResultsetRowList in Safari/iOS

javascript,jquery,ios,sqlite,safari
I'm trying to use $.each to speed up iteration of a SqlResultsetRowList where I'm currently using a For loop. Here is the new code - localDB.transaction(function(transaction){ transaction.executeSql(query, [val], function(transaction, results) { var rows = results.rows; $.each(rows, function(i) { var row = results.rows.item(i); }); } ) }); The problem is i...

Snap.load() callback function triggered too late in Safari

javascript,svg,safari,snap.svg
PROBLEM In my code MySymbolsObject.js - code reported inline just for example purposes - set a window.onload event in order to Snap.load() a svg file and save the svg fragment node in Symbols.resources The last inline <script> set a second window.onload event containing code that uses the svg node saved...

Angular ui-bootstrap popover text overflow using safari

angularjs,safari,angular-ui-bootstrap,popover
There is an issue with text overflowing ui-bootstrap's popover on the Safari browser. The problem was initially seen on an iPhone with its narrow screen but also occurs on Windows7 running Safari 5.1.7. When a popover occurs outside the window, the horizontal scroll bar is enabled to view the element,...

iOS Safari play sounds in sequence after one touch

javascript,ios,audio,safari,playlist
I'm doing some R&D with playing audio on safari for iOS. I know that there are limitations for playing audio programmatically in the sense that it has to be done from a user initiated event. What I am wondering though is if we can initiate a playlist. I want to...

Chrome opacity transition bug

html,css,google-chrome,safari,css-transitions
So i'm trying to build a link page with 2 divs. Both covering 50% of the screen. I would like to keep this 100% CSS, because I don't want to use javascript and I am not familiair with Jquery. My problem seems to be a bug, according to lots of...

CSS animation “transform: scale” not working in Safari and possibly other browsers

css,safari
@-webkit-keyframes scaleIn { from {-webkit-transform: scale(0);} to {-webkit-transform: scale(1);} } .animate-log-in { animation-name: scaleIn; animation-duration: 0.5s; } It's working on the latest version of Chrome (Mac OSX) but not in the latest version of Safari and an older version (I think) of Chrome. Is there anything I need to add?...

CSS background-color transition not working in specific browsers (desktop + mobile)

css,safari,mobile-safari,css-transitions,transition
I have this SCSS that, in theory, should transition the background color smoothly, but it is not smooth in specific browsers. See this codepen for a demo: http://codepen.io/ahegyi/pen/Wvjajy (Click on the photo or note text to activate the transition. It's more obvious if you click on the text.) .overlay {...

Sticky Menu Display Error When Viewing in Safari

javascript,menu,safari,sticky,genesis
I have a site built on Wordpress using a Genesis theme, HERE. I recently implemented a "Sticky Menu." The menu works great in Chrome, Opera and Firefox, but has a weird graphical issue in Safari. Upon scrolling down, the menu in Safari "flies in" from the left hand side of...

text wrap issue with Safari on iOS iPad

html,ios,css,ipad,safari
I have got a browser specific design issue with Safari iOS (using ipad). phone icon which I placed in the label field for that menu, bumps up to a second line. It is working fine other browser. I tried with white-space:nowrap CSS. but that doesn’t work. So I am not...

FileReader on safari firing to soon

javascript,canvas,safari,filereader
I'm working on a multi part html questionnaire style form that has a lot of text questions along with a few images. On questions that are images the user is selects the image, i create a canvas element and display the resized image in it underneath the file input. if...

Undocumented word-break: break-word CSS property?

css,safari,word-wrap
We want to avoid long words overflowing the line and let them be broken if they have to, for which the standard approach is word-wrap: break-word Or its equivalent overflow-wrap: break-word However, we found this not to work on Safari (including Mac and iOS). We then discovered by accident that...

iOS 7 jQuery animation fail on mobile opera

jquery,mobile,ios7,safari,jquery-animate
I'm working on drupal theme which should support iOS7 device. On my page I placed little button that scrolls to exact page position (After specified item). I wrote simple function: $('#scrollbutton').click(function(e){ e = e || event; var offset = $(this).offset(); //offset.left -= 20; offset.top += 1; $('html, body').animate({ scrollTop: offset.top,...

getJSON from Google Apps Script not working in Safari

google-apps-script,safari,getjson
I've created this piece of code to handle my user login. var gasUrl = "https://script.google.com/macros/s/[my id]/exec"; function submitFormData() { var username = $("#inputEmail").val(); var password = $("#inputPassword").val(); $.getJSON(gasUrl + "?username=" + username + "&password=" + password, function(data) { if(data[0]) { localStorage.setItem("username", data[0].username); localStorage.setItem("id", data[0].id); window.location.href = "/index.php"; } else {...

Safari not displaying web page (works in IE, Chrome, and Firefox)

html,css,safari,rendering,server
I've updated a website for a client and am having rendering issues in Safari. Here is a link http://vrbart.com/ When I tested the file on my server in various versions of Chrome, IE, Safari it worked great no font issues or layout issues — it's a linux server. Last night...

Testing localhost on browserstack - Safari 8 (on Yosemite) cant open my site

osx,visual-studio,iis,safari,browserstack
I have problems with testing my site hosted on IIS Express via Browserstack. When I try to open it using Safari 8 (on latest osx) I get message: "Safari cant connect to the server". I have tried on other OS or other browsers and it works, but under latest safari...

Silverlight onLoad event doesn't fire in Firefox or Safari

javascript,silverlight,firefox,safari
I'm struggling with the Silverlight onLoad event in Firefox/Safari. In IE they fire as they should but in FF/Safari they don't. I create the Silverlight object from JavaScript supplying the necessary params incl the onError and onLoad events. I've omitted some parts of the code below for readability. Am I...

window.onload triggered before font-face load

javascript,html,css,safari,font-face
The following webpage loads Font Awesome, displays the icon fa-check, and has a debugger breakpoint on window.onload: <!DOCTYPE html> <html> <head> <link rel='stylesheet' href='http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css'> <script> window.onload = function () { debugger; }; </script> </head> <body> <div class='fa fa-check fa-4x'></div> </body> </html> On Chrome (with the console open), the breakpoint is...

Safari inline-block not floating

html,css,safari
I'm using the following HTML and CSS to create elements which are tightly together in a 100% space (floating?). <div class="wrapper"> <div class="image">This is image</div> <div class="content">This is content</div> </div> .wrapper { font-size: 0; } .image, .content { display: inline-block; box-sizing: border-box; width: 50%; color: #000; font-size: 18px; } .image...

transform-origin doesnt apply in safari

css,safari,transform
Why doesn't transform-origin doesn't work in Safari? Here, how it should look (Chrome): http://i.imgur.com/f3zBu8e.png Here, how it looks in Safari: http://i.imgur.com/0XrPYXs.png I already tried some stuff with percents but it my content divs are having different sizes, so it looks awkward. Here's the JSFiddle. http://jsfiddle.net/2f4pferq/ text-align: right; -ms-transform: rotate(-90deg); -ms-transform-origin:...

How certain page element can be hidden in Safari Reader?

javascript,html,css,safari
I've got social links on my page. In reader mode, they're showing, and i want to hide them. Social links block looks like this: <div class="social-likes"> <span class="social-likes__item"> <span class="social-likes__button" data-social="facebook"> <svg class="social-likes__icon social-likes__icon_facebook"><use xlink:href="/images/m/svg/sprite.svg#social-likes__icon_facebook"></use></svg> </span> <span class="social-likes__counter">0</span> </span> <span...

Safari and Firefox input elements do not get focus on click

jquery,angularjs,google-chrome,firefox,safari
I am not quite sure how to ask this question. I wrote the website http://math.qb.is, first I did this in jQuery and Handlebars, then I rewrote it in AngularJS, but the end result is the same. Only the first question will get focus, and trying to click on any element...

error while sending text to div field in Safari using protractor

selenium,selenium-webdriver,safari,protractor,end-to-end
I've got a text area div field: <div id="shortansweractivityId" class="shortanswerText ng-pristine ng-scope ng-isolate-scope ng-invalid ng-invalid-required ng-touched" ng-model="activity.answer" ng-if="isEditable" ng-focus="editing()" placeholder="Write here..." contenteditable="true" content-type="text"></div> I'm able to use sendKeys in chrome using: element(by.css('div#shortansweractivityId')).sendKeys('Test'); But when run the same in safari it errors out: UnknownError: undefined is not an object (evaluating 'b.value.length')...

Bootstrap badge don't always appear in Safari

jquery,safari,bootstrap
I have a tool that has 3 tabs and some counters on each tab. The title of the tab is supposed to have a badge that shows a total of all counters on that tab. If the total is 0, it shouldn't show any badge. This all works fine in...

CSV downloading in Safari browser

html5,safari
How to create download links for CSV file downloading in Safari browsers? Right now download link is this: <a href="http://localhost/uploads/user-import-template/SupportUs_user_import.csv">download CSV template</a> Problem is that this link opens CSV file in same browser tab, instead of downloading it....

Bitmap in SVG not rendering in Safari

css,svg,safari
In this project: https://test.restaurantacasa.cat/ I use vectors as restaurants logos. In some of them, I include (embed in the svg) a bit of bitmap, for an example, here: https://test.restaurantacasa.cat/#!/restaurant/el-campanar However, if you open that one in Safari (mobile or desktop), you'll notice that the bitmap section is not rendered. Can...

Web page behaves differently for Safari

html,ios,safari
The following html code is a cut down version to demonstrate a problem when using it on an ipad or iphone with Safari. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html lang="en"> <head> <meta charset="utf-8" /> <title>Testing</title> <script type="text/javascript"> function getstuff() { document.dataentry.tandc.blur(); <!-- Show the Continue button now -->...

Enabling rapid, multiple taps on Safario in iOS

javascript,html,ios,safari,fastclick.js
I'm using the Fastclick.js library to get rid of the 300ms delay in iOS Safari when pressing buttons and links. It definitely removes the delay for one-off clicks, but I have an application where a user has to rapidly tap a button in the browser, and the button needs to...

Slice ArrayBuffer with Safari and play it

safari,web-audio,arraybuffer
I need to load a mp3, slice and play it using web audio , on firefox a slice mp3 any where and decode work fine, but on safari an error with null value occurs. Exist a trick or a way do slice the ArrayBuffer on Safari? player.loadMp3 = function(url, callback)...

Cordova won't start Safari, shows website in app

javascript,ios,cordova,safari,phonegap-plugins
It's all in the title. I Tried EVERY possible way. I tried the InAppBrowser plugin, but whatever I do. It always opens in my app instead of in Safari. There is nothing wrong with this code I think? window.open(encodeURI('http://XXX.XXX.XXX.XXX/linkylink/'+ variable.link), "_system",'location=no'); Also if i change location to yes. I dont...