Search the Community

Showing results for tags 'safari'.



More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


Forums

  • W3Schools
    • General
    • Suggestions
    • Critiques
  • HTML Forums
    • HTML/XHTML
    • CSS
  • Browser Scripting
    • JavaScript
    • VBScript
  • Server Scripting
    • Web Servers
    • Version Control
    • SQL
    • ASP
    • PHP
    • .NET
    • ColdFusion
    • Java/JSP/J2EE
    • CGI
  • XML Forums
    • XML
    • XSLT/XSL-FO
    • Schema
    • Web Services
  • Multimedia
    • Multimedia
    • FLASH

Calendars

  • Community Calendar

Group


AIM


MSN


Website URL


ICQ


Yahoo


Jabber


Skype


Location


Interests


Languages

Found 13 results

  1. is there a better online resource to test responsive design modeling than the Safari browser's RD option?
  2. Hello Internet, I'm having an issue with how Safari is rendering a picture on my smartphone - but not chrome. Any thoughts on why this is happening? Please attached image.
  3. Helloin this page, in wich I used fullpage.js, I have some issues with (i think) the flexbox with safari and with android browser (portrait view). The boxes are overlapped and not stacked. Is it possible to fix this problem? thanks Luigi
  4. Hello Everyone, I'm fairly new to web design and the new site I'm working on looks awesome in safari but when I open it in internet explorer it's all screwed up. I didn't know if there was an easy way to make everything the same across the board? If not, what is the easiest/best way to do go about making sure they are all the same? Thank You!
  5. Hi, I am having trouble with the page bottom of my website. It is not showing consistently when viewed in different browsers. Chrome and internet explorer seem to be pretty similar, however in safari the information sometimes spills over the page bottom. What is the best way around this? Do i need to get some kind of code to get the different browsers to respect the spacing on my page? Please have a look at: http://www.mygraphicdesign.com.au/pagebottom/faq/index.html What can i do to make this display correctly at the bottom in the different browsers! Another page is: http://www.mygraphicdesign.com.au/pagebottom/index.html As an example Dont look at the other pages as they are the old site. The two posted above are my new site so only for these two pages please. The only solution i have thought of so far was to make the page bottom really really big so that at least it does not get cut off on some of the browsers, but it doesn't really look that great =( Please help!!!! I have no idea how to fix this!!!
  6. My client has changed her ™s to ®s, but wants the ® smaller than the font. I've tried it half a dozen ways, most of which work in Firefox and Chrome but do not work in Safari. Right now it reads: <span class="introheader®"><sup>®</sup></span> and .introheader® { font-family: Verdana; font-size: 5px; line-height: 1.4em; font-weight: bold; color: #552C16; text-align: left; vertical-align: text-top; } I've lost track of how many variations I have tried. Looks fine in DreamWeaver Live View, Firefox and Chrome, just not in Safari. Anyone else come across this?
  7. Hello,i have a problem with the css rule display: flex. Well to be honest, the problem is with the Safari browser. Every other browser displays the page as i intend it to display, but with Safari there´s a problem. I have a container with the class of promo that holds tree colomns with the class of coluna. The CSS is as fallows: .conteudo .promo { max-width: 100%; display:flex; display:-webkit-flex; flex-flow:row wrap; -webkit-flex-flow:row wrap; justify-content:center; } .conteudo .promo .coluna{ -moz-box-sizing:border-box; -o-box-sizing:border-box; -webkit-box-sizing:border-box; box-sizing:border-box; max-width: 32%; padding: 5px; margin: 5px; display:flex; display:-webkit-flex; flex-flow:column; -webkit-flex-flow:column; } Is there anything i´m doing wrong because only in Safari the page isn´t displayed as it should.I´d really need some help. Please!!!!The page is on: www.sistemagestorconteudos.net/Alfaccop/Sitio8 Torsuntsu
  8. Hey all. First post here. I'm having some difficulty with cookies and Safari. I've pasted my code below. isValidUser is a function that queries the database. When I test it out on Chrome it works well. In Safari I'm able to log in, but as soon as I navigate away from the page, the cookies disappear. I've tried several permutations with the URL at the end of setcookie including with or without leading '.' and with or without trailing '/' without success. Any help would be greatly appreciated. Thanks, Keith /*------------------------------------------------------------------- * login * * username: is the person's e-mail address * password: is stored separately *-------------------------------------------------------------------*/function login ($username, $password){ if (!isValidUser($username, $password)) return false; setcookie('username', $username, time()+60*60*24*365, '/', '.northernlightsnordic.org'); setcookie('password', md5($password), time()+60*60*24*365, '/', '.northernlightsnordic.org'); return true;} //end login/*------------------------------------------------------------------- * logout * * *-------------------------------------------------------------------*/function logout (){ setcookie('username', "", time() - 3600, '/', '.northernlightsnordic.org'); setcookie('password', "", time() - 3600, '/', '.northernlightsnordic.org'); return true;} //end logout
  9. I am trying to finalise a co-creation website that swaps image when certain radio buttons are selected. It works in Firefox.. can anyone tell me why it is not working in Safari? http://www.designpartners.co.uk/Product/SmartPhone_Skin/ The part that I feel does not connect is as below: } var sel = document.getElementById("mainimg"); var s = grps+""; while (s.length < 5) s = "0" + s; sel.src = "http://www.designpartners.co.uk/resources/iPhone-skins/skin-options/iPhone_Skins_Art_Case"+s+".png"; } function addmodelid() { var textbox = document.getElementById("item_number"); var mainimg = document.getElementById("mainimg"); var s = mainimg.src textbox.value = s.substring(71); return true; } </script> <div id="columns"> <div class="right column"> <p><img title="Fudged Skins" id="mainimg" alt="mainimg" src="http://www.designpartners.co.uk/resources/iPhone-skins/skin-options/iPhone_Skins_Art_Case02000.png" height="480" width="380" border="0" onsubmit="return addmodelid()"(mainimg)>
  10. Hello Internet. Back for another question. I am using CSS styling to make an image larger during a hover event. I have made the code work for IE but Safari does not like it. Actually what Safari is doing is once you click on the image it will show the original image AND the hover image together and separated. The desired effect is that once you hover over an image it will increase the image size. Please help... Here is my CSS code:.thumbnail{position: relative;}/*CSS for enlarged image*/.thumbnail span{position: relative;padding: 0px; left:0px; border: 0px solid #000000;visibility: hidden; color: black; text-decoration: none;}/*CSS for enlarged image*/.thumbnail span img{border-width: 1px solid #000000;padding: 0px;}/*CSS for enlarged image on hover*//*position where enlarged image should offset horizontally */.thumbnail:hover span{visibility: visible;top: -64px;left: -5px;} /*CSS to place DIV around the original image so it does not disturb the rest of my page*/.enlrg{ width:60px; height:70px; border: 1px solid #ffffff; float: left; margin-left: 0px;} Here is my HTML Code:<div id="enlarge" class="enlrg"><a class="thumbnail" href="http://espn.go.com/mens-college-basketball/team/_/id/97/louisville-cardinals" target="_blank"><img src="lvillelogo1.jpg" width="50" height="38" style="float: left; margin-left: 13px; margin-top: 20px;"><span><img src="lvillelogo1.jpg" width="60" height="44" style="float: left; margin-left: 13px; margin-top: 20px;"></span></a></div><div id="enlarge" class="enlrg"><a class="thumbnail" href="http://espn.go.com/mens-college-basketball/team/_/id/2483/oregon-ducks" target="_blank"><img src="oregonlogo1.jpg" width="50" height="38" style="float: left; margin-left: 9px; margin-top: 20px;"/><span><img src="oregonlogo1.jpg" width="60" height="44" style="float: left; margin-left: 9px; margin-top: 20px;"></span></a></div>
  11. So basically i would like my navigation to be on all browsers except IE 0 to 6 <![if !IE]> //So this would also have to have from ie 7 to latest <!--[if IE]> //This from ie stone age to ie 6 Site: http://mudsaf.info/
  12. My page does not view correctly in other web browser than Firefox.I want the page to have a "book/magazine" design, where you flip to the next page in HTML. I managed to get the design i wanted, but when i view my page in other browsers, it does not look like it does in firefox. Here is the page I am talking about -open in Firefox for correct view, and then try safari/chrome/opera. Why is it like this?http://www.ia-stud.h...strate/inn.html Here is the source-code:<html><head><META HTTP-EQUIV="CONTENT-TYPE" CONTENT="text/html; charset=utf-8" /><META NAME="COPYRIGHT" CONTENT="© Ole Andersen, Sun Feb 26 22:43:51 CEST 2012" /><title>Ole Andersen</title> <style type="text/css">a:link {text-decoration: none;COLOR: inherit;}a:visited {text-decoration: none;COLOR: inherit ;}a:hover {text-decoration: none;COLOR: 778899 ;}a:active {text-decoration: none;COLOR: inherit;} img{ margin-right:0px;}</style> <style>#huskelapp{ position:absolute;background-color:#FFFFFF ;border-top-right-radius: 20px;border-top-left-radius: 20px;border-bottom-right-radius: 20px;border-bottom-left-radius: 20px;padding-left: 10px;padding-top:5px;padding-right:4px;padding-bottom:5px;left:240px;height:1110px;width:817px;top:130px;opacity:0.6;filter:alpha(opacity=60);z-index: 0;overflow: hidden;float:left;overflow: hidden; } <!--#wrapper{margin: 0 auto; width: 680px; background-image:url('images/pages.png'); height:601px;}--> #wrapper{margin: 0 auto; width: 1070px; height:601px;} #left{height:540px;width:470px;padding-left: 40px;padding-top:40px;padding-right:40px;padding-bottom:40px; background-image:url('images/inn.png');float:left;} #right{height:540px;width:470px;padding-left: 40px;padding-top:40px;padding-right:40px;padding-bottom:40px; background-image:url('images/right.png'); overflow: hidden;} html{ background: url(images/pages.png) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover;} </style> </head> <body> <div id="wrapper"> <div id="left"> <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br> <center><font color="#000000" face="futura"><font size="1">2 - <a href="index.html">Forrige Side</a> </font></center></div> <div id="right"> <table align="left"><tr><td> <br><font color="#000000" face="futura"><font size="1"> </font></td> <td> <font color="#000000" face="futura"><font size="1"> </td></tr></table> <br><br><br><br><br><br><br><br><br><br><br><br><br><center><font color="#000000" face="futura"><font size="1">3 - <a href="1-2.html">Neste Side</a></font></center> </div> <!-- END of #wrapper div --></body> </html>
  13. I'm using the following code. By clicking on div id="popUpPane", the div and it's childs should appear and slowly fade in.By clicking on the div again, it should slowly fade out and then disappear.Firefox and Chrome (which is webkit too) behave that way and I know Safari did in an earlier version, too. But right know on Safari and on Safari Mobile nothing happens at all when I click on "popUpPane".Is this a bug in Safari or is there something I could change to come back to the intended behaviour?One addition: If I set -webkit-transition to -webkit-transition: opacity .5s ease-in-out; it works fine but the transition only appears on the first click. There's no transitions after that first one... If I delete the opacity-part in the java-script the opo-up works but there's no transition.All other transitions on my site are working. But they all use only opacity and no visibility.Here's my code:CSS:#popUpPane { white-space:normal; position:fixed; width:100%; height:100%; top:0; left:0; text-align:center; vertical-align:middle; visibility:hidden; z-index:90; } #greyOut { position:fixed; width:100%; height:100%; top:0; left:0; background-color:#000; opacity:0; }#popUpPicCanvas { position:relative; top:50%; margin-top:-325px; display:inline; opacity:0; z-index:100; }.fade { -webkit-transition: all .5s ease-in-out; -moz-transition: all .5s ease-in-out; -o-transition: all .5s ease-in-out; transition: all .5s ease-in-out; }HTML: <div id="popUpPane" onClick="noPopUp()"> <div id="greyOut" class="fade"> </div> <canvas id="popUpPicCanvas" width="1000" height="650" title="Bastian Beuttel" class="fade"></canvas> </div>Javascript:var popUpPane = document.getElementById("popUpPane"), greyOut = document.getElementById("greyOut"), popUpPicCanvas = document.getElementById("popUpPicCanvas"), popCanvasContext = popUpPicCanvas.getContext("2d");var doPopUp = function(source,x,y){ var popUpPic = document.getElementById("pic"+source); popCanvasContext.canvas.width = x; popCanvasContext.canvas.height = y; popCanvasContext.drawImage(popUpPic, 0, 0,x,y); popUpPane.style.visibility = "visible"; greyOut.style.opacity = "0.7"; popUpPicCanvas.style.opacity = "1";};var noPopUp = function(){ greyOut.style.opacity = "0"; popUpPicCanvas.style.opacity = "0"; popUpPane.style.visibility = "hidden";};I hope someone can help me.Thanks for your responds!