Search Results

Search found 67 results on 3 pages for 'mobilesafari'.

Page 1/3 | 1 2 3  | Next Page >

  • Reordering items in mobilesafari

    - by Marek
    After searching around i still have no clue about the best practice to reorder a set of items in mobile safari. I'm currently using, in the desktop version of my webapplication, jQuery sortable function applied to a set of table rows, with an ajax callback to update items positioning. What would be the best way of doing this in mobile safari through jquery or plain javascript? The table is longer then the screen, so also the normal scrolling should be present. Other approaches that are usable and do not make use of drag and dropping are also welcome. Thanks.

    Read the article

  • Why doesn't border-radius work properly on text inputs in MobileSafari?

    - by abrahamvegh
    Here is a reference HTML document: <!DOCTYPE html> <html> <head> <style> body { background-color: #000; } input { -webkit-border-radius: 20px; } </style> </head> <body> <input type="text" value="text" /> </body> </html> The border-radius renders fine on Safari/WebKit-based desktop browsers, but on the "MobileSafari" variant, namely the iPhone and iPad browsers, it renders with this strange box, which destroys the illusion of rounded corners when the input is being displayed on top of a differently-colored background.

    Read the article

  • Alpha transparent PNGs not displaying correctly in Mobile Safari

    - by worksology
    I'm using some semi-transparent PNGs as background-images on various websites. These are usually something like a 1x1 image with a 30-percent opaque white layer. I've noticed that Mobile Safari does not display them correctly, giving them a darker/grayish tint. I've created a couple test pages to illustrate. View them both in your normal browser, and then on Mobile Safari, and you should see what I mean. This shows 11 red images of varying opacities on white: http://thecompleteworks.org/alpha-tests/index-red.html This shows 11 white images of varying opacities on blue: http://thecompleteworks.org/alpha-tests/index.html Is this a MobileSafari bug (I couldn't imagine so), or do I need to do something different, either to my pages or PNGs? (Here's how I create the PNGs: In Photoshop, create a 1x1 transparent canvas. Draw a white rectangle in Layer 1. Set opacity to, say 30 percent, Save for Web as 24-bit PNG with transparency.)

    Read the article

  • Adding a header view to a UIWebView similar to Safari and Articles

    - by MrMage
    I'd like to add a header view to an UIWebView similar to the address/search bar in MobileSafari and the excellent Articles.app by Sophia Teutschler. More precisely, I'd like to create a "pull to fix orientation" view above a UIWebView, just like in Articles. Articles does use a UIWebView, so it seems to be possible. Is there a way to accomplish this without having to embed the UIWebView into a UIScrollView and updating its size all the time, as described in this article? Apparently, I do need the scrolling events to have the "pull to fix orientation" behave accordingly.

    Read the article

  • Selecting text in mobile Safari on iPhone

    - by Goldy
    I'm trying to make it easy for an iphone user to copy some text to the clipboard in mobile safari. As in the usual "touch-hold-copy". There is a specific bit of text I want to a user to copy. I have full choice of the html markup in which to wrap the text. How can I make it easy, rather than abitrary? For instance: Is there a way to "select all" the text upon touch-down using javascript? Then a user could just continue to touch-hold and then choose copy? Is there a way to bring up the "select all" option? Like you can when typing in a text box? After which they can choose copy? If there's no javascript solution, how can I arrange the html to help Safari select the right bit of text easily? As opposed to just a word, or a wrapping div? I've tried onFocus="this.select()" for various elements, none seem to work. Also tried onClick. Those who have tried to port a site that uses ZeroClipboard to the iPhone might have some ideas. Cheers

    Read the article

  • Set textbox focus in mobile safari

    - by Morgan
    Hey, i was wondering how to set the focus to a textbox in mobile safari. I've tried document.myForm.myTextArea.focus(); which works in regular safari, but it does not seem to work in mobile safari. To clarify, i want to set focus to a text box as soon as the user loads a page, and have the iphone keyboard pop up.

    Read the article

  • How to require fullscreen mode in a jQTouch application?

    - by Christopher Young
    I'm using jQTouch to develop a version of a website optimized for safari on the iphone. The jQTouch demo helpfully shows how to show an "install this" message for users not using full screen mode and hide it for those who are. When in fullscreen mode, the body should have the class "fullscreen." So you can hide the "install this" message for people who have already added your app to their home page by adding this css rule to your stylesheet: body.fullscreen #home .info { display: none; } What I'd like to do is require users to use the app in fullscreen mode only. When viewed from the regular browser, they should only see a message asking them to install the app. That message should of course be hidden otherwise. This ought to be really, really easy, so I must just be missing something obvious. I thought one way to do this would be to simply test for the class "fullscreen" on the body: if it's not there, use goTo to get to another div, or hide the other divs, or something like that. Strangely, however, this doesn't work. As a test, I've still got the original "info" message, as in the jQTouch demo, and it doesn't show up when I launch in fullscreen mode. So the body must have the fullscreen class. And yet I can't find any other trace of it: when I put this alert to test things after the document has loaded, I get nothing when launching in fullscreen mode: alert($("body").attr("class")); I also thought I might test for fullscreen mode by checking for the value of the fullScreen boolean. But this doesn't seem to work either. What am I missing? What is the best way to do this?

    Read the article

  • Why doesn't @contenteditable work on the iPhone?

    - by plutext
    Safari HTML Reference: Supported Attributes says: contenteditable If true, the element can be edited on the fly; if false, it cannot. Availability Available in Safari 1.2 and later. Available in iPhone OS 1.0 and later. However, on my iPhone, I can't get it to work. Anyone have success with this? You can try it with this document (admittedly not pure html, but that document works in desktop Safari, and Chrome and Firefox 3). I haven't been able to get even the simplest html document to be editable in mobile Safari.

    Read the article

  • Jquery autocomplete Items not clickable in mobile safari

    - by princyp
    I'm using the defualt jquery autocomplete plugin in my iphone web app, it builds a div with li's. In the browser the hovers and click events work for this but in mobile safari if I click it highlights the entire results containing div. Do I need to create seperate event listeners for the iphone? How would I go about doing this? thanks

    Read the article

  • Error when using mailto: link in Mobile Safari in app-capable mode

    - by Elisabeth
    I've got a form in a web page with an action that is "mailto:email" (where email is a real email address). When I load this page in Mobile Safari in regular mode (ie, not launched from home screen with app-capable mode), this works fine - after I submit the form, the email app comes up. However, when I'm in app-capable mode and have launched from the home screen (so, no Safari chrome), and submit the form I get the error "URL can't be shown". However, a regular mailto: link (ie, not in a form) does work when in app-capable mode. Has anyone else noticed this? Any workarounds? Are forms disallowed in app-capable mode? Thanks, Elisabeth

    Read the article

  • GWT & HTML5 Video in Mobile Safari

    - by KevMo
    I'm trying to code a site in GWT that plays videos with HTML5. Everything works great on the desktop, but mobile Safari on both the iPhone and iPad do not play the video. I can play a video using Video for Everybody. I've even copied the code to my own plain HTML page, and it works flawlessly. If I serve that same code via a GWT widget, mobile safari will not play the video. On the iPhone I see a gray box with a prohibitory sign around the play button, and on the iPad it shows up as a black box. I've made sure my doctype is <!DOCTYPE html>, but I don't know where else to start debugging. Perhaps it it because the code is injected via javascript? Any pointers on where to start looking would be greatly appreciated. Here is the exact code I am using for the video: <!-- "Video For Everybody" by Kroc Camen. see <camendesign.com/code/video_for_everybody> for documented code =================================================================================================================== --> <video width="640" height="360" poster="poster.jpg" controls autoplay> <source src="http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4" type="video/mp4"></source> <source src="http://clips.vorwaerts-gmbh.de/big_buck_bunny.ogv" type="video/ogg"></source> <!--[if gt IE 6]> <object width="640" height="375" classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B"><! [endif]--><!--[if !IE]><!--> <object width="640" height="375" type="video/quicktime" data="http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4"> <!--<![endif]--> <param name="src" value="http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4" /> <param name="autoplay" value="true" /> <param name="showlogo" value="false" /> <object width="640" height="384" type="application/x-shockwave-flash" data="player.swf?autostart=true&amp;image=poster.jpg&amp;file=http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4"> <param name="movie" value="player.swf?autostart=true&amp;image=poster.jpg&amp;file=http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4" /> <!-- fallback image --> <img src="poster.jpg" width="640" height="360" alt="Big Buck Bunny" title="No video playback capabilities, please download the video below" /> </object><!--[if gt IE 6]><!--> </object><!--<![endif]--> </video>

    Read the article

  • How to find (in javascript) the current "scroll" offset in mobile safari / iphone

    - by mintywalker
    I'd like to know the x/y offset of the how far the user has "scrolled" within the viewport in mobile safari on the iphone. Put another way, if I (through javascript) reloaded the current page, I'd like to find the values I'd need to pass into window.scrollTo(...) in order to reposition the document/viewport as it is currently. window.pageXOffset always reports 0 jquery's $('body').scrollTop() always reports 0 events have a pageX, but this won't account for the scrolling of the page that happens after you release your finger if your gesture was to "flick" the page up/down. Namely, it'll give me a point when the finger leaves the screen, but that doesn't always match where the page will be after it's finished scrolling. Any pointers?

    Read the article

  • Playing online video on iphone web, the iphone seems to cache the reference movie

    - by Mad Oxyn
    We are working on an online mobile video app, and are trying to play a reference movie on an iphone from the iphone browser. The problem is, the movie plays the first time, but when we try to play a different movie the second time, it doesnt. Quicktime gives a general error message sayin "Cannot Play Movie". More precisely this is what we are trying to do: Connect with an iPhone to a webserver that serves a reference movie (generated with quicktime pro). The ref movie automatically gets downloaded to the iphone by quicktime. Quicktime then chooses one of the 3 references in the reference movie, based on the connection speed, and tries to download the designated movie via a relative path. A servlet gets called and forwards the relative path to the right movie. This all works the first time. However the second time when we want download different movies, we get the quicktime error. Test case: Open reference movie 1 Movie plays in Quicktime Open reference movie 2 ERROR: Quicktime gives an error - Cannot Play Movie Shut down Iphone Turn Iphone on again Open reference movie 2 Iphone plays movie Open movie ERROR: Quicktime gives an error - Cannot Play Movie Did anyone encounter similar issues with quicktime and the use of reference movies and is there something we can do to work around that?

    Read the article

  • Using of html5 <video> tag in web-based applications for iPhone

    - by Alexander Sharov
    As you know iPhone plays video content from < video tags in full-screen mode via internal media player. Here I have several questions: 1) is it possible to show custom text over video playing? something like subtitles appeared during movie playback. I tried several solutions like http://blog.gingertech.net/2008/12/12/attaching-subtitles-to-html5-video/, but seems they are not working in iPhone case. Ideally, I want to add some div over media player and show necessary information there. 2) is there any way to disable controls of iPhone media player. Seams it is not metter if you add "controls" attrinbute to < video tag or don't add, iPhone always switch on controls for media player. The goal for me is do not allow to user to change playback possition(user should see full movie from start to finish. Of course user can stop the video, but he can't rewind a record) Thanks for your help.

    Read the article

  • Sources for iPad web programming?

    - by MikeJ
    Anyone got some good references for targeting web content to the iPad web browser? i know its still very early days but I havent got any good indicator on how to setup CSS to fix iphone/ipod touch versus the larger screen of the iPad? or do I just consider it to be like safari on the bigger Macs

    Read the article

  • iPhone Safari localStorage does not persist after device reboot

    - by Tom
    Hi, I write a simple iPhone web app using HTML5's localStorage. Tests on a 2G device show the data does not persist after an iPhone reboot. This is a test code: <html> <head> <meta name="viewport" content="height=device-height, width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" /> </head> <body> <script> alert("1:" + localStorage.getItem("test")); localStorage.setItem("test", "123"); alert("2:" + localStorage.getItem("test")); </script> </body> As far as I understand the data should persist even after a device reboot. Can anyone shed some light on this behavior? Thanks! Tom.

    Read the article

  • Available iPhone Web Application JavaScript UI Library/Frameworks

    - by methym
    I'm starting a web application that will target Mobile Safari on iPhone/iPod Touch. I'm evaluating the available client-side JavaScript/CSS libraries/frameworks that are currently out there. These are the ones I'm currenlty aware of: iUI CiUI UiUIKit WebApp.Net iWebKit Apple's Dashcode Application - not really a standalone library/framework, but it provides/generates JavaScript, CSS, and images that conform to the native iPhone UI metaphors. Are there any others out there? I want to make sure I'm not missing any before I make a decision. I'm only looking for client-side JavaScript/CSS solutions and building one from scratch isn't an option because of time constraints. No server-side PHP, Ruby, Python, Java, etc. solutions. I am aware of the iPhone web applications, templates, frameworks? question that was asked, but this only mentioned iUI and UiUIKit. Thank you

    Read the article

  • A problem of trying to implement scrolling inertia with jQuery

    - by gargantaun
    I'm trying to add some iPhone style scrolling inertia to a web page that will only be viewed on the iPad. I have the scrolling working in one direction (scrollLeft), but it doesn't work in the other direction. It's a pretty simple function function onTouchEnd(event){ event.preventDefault(); inertia = (oldMoveX - touchMoveX); // Inertia Stuff if( Math.abs(inertia) > 10 ){ $("#feedback").html(inertia); $("#container").animate({ 'scrollLeft': $("#container").scrollLeft() + (inertia * 10) }, inertia * 20); }else{ $("#feedback").html("No Inertia"); } } I've bound it to the 'touchend' event on the body. The intertia is the difference betweent he old moveX position and the latest moveX position when a touch ends. I then try to animate the scrollLeft property of a div that contains a bunch of thumbnails. As I've said, this works when scrolling to the left, but not when scrolling to the right. You can view the full source code (all in one page) or test it on your iPhone or iPad (or in the simulator) here http://www.appliedworks.co.uk/files/times/swipegal.html Any ideas?

    Read the article

  • Mobile iPhone - Multiple buttons in a row

    - by Thomas
    Hello all: I'm an iPhone developer, but new to web development. I've done some basic HTML websites and made one in iWeb as well. I'm trying to branch out to actual mobile development now, so I checked out Dashcode. Anyway, I'm trying to put a Call Button, Mail Button, and Map Button in horizontal alignment. I realize that I can add a Column Layout and have two buttons in a row, but that's the most I've gotten. Any ideas? Thanks! Thomas

    Read the article

  • Dashcode code translation

    - by Alex Mcp
    Hi, a quick, probably easy question whose answer is probably "best practice" I'm following a tutorial for a custom-template mobile Safari webapp, and to change views around this code is used: function btnSave_ClickHandler(event) { var views = document.getElementById('stackLayout'); var front = document.getElementById('mainScreen'); if (views && views.object && front) { views.object.setCurrentView(front, true); } } My question is just about the if conditional statement. What is this triplet saying, and why do each of those things need to be verified before the view can be changed? Does views.object just test to see if the views variable responds to the object method? Why is this important? EDIT - This is/was the main point of this question, and it regards not Javascript as a language and how if loops work, but rather WHY these 3 things specifically need to be checked: Under what scenarios might views and front not exist? I don't typically write my code so redundantly. If the name of my MySQL table isn't changing, I'll just say UPDATE 'mytable' WHERE... instead of the much more verbose (and in my view, redundant) $mytable = "TheSQLTableName"; if ($mytable == an actual table && $mytable exists && entries can be updated){ UPDATE $mytable; } Whereas if the table's name (or in the JS example, the view's names) ARE NOT "hard coded" but are instead a user input or otherwise mutable, I might right my code as the DashCode example has it. So tell me, can these values "go wrong" anyhow? Thanks!

    Read the article

  • Javascript won't execute in iPhone Safari

    - by Stuart Meyer
    I'm running into this issue only because I recently purchased an iPhone. The javascript for a picture carousel on my website (http://www.stuartmeyerphotography.com) won't execute in Safari for iPhone. I thought it worked on Mac Safari last I checked with a friend who had a Mac (a year ago), but now I need to go back and check that too to make sure it works on the Mac. "View source" on my website would show the entire html page, but I've pulled the code from the body section to show here: carousel({id:'Photos', border:'', size_mode:'image', width:120, height:120, sides:8, steps:75, speed:4, direction:'left', images:['mainthumbs/babiesthumb.jpg','mainthumbs/engagementsthumb.jpg','mainthumbs/dancethumb1.jpg','mainthumbs/artistthumb.jpg','mainthumbs/portraitsthumb1.jpg','mainthumbs/seniorsthumb1.jpg','mainthumbs/wedthumb1.jpg'], links:['babies/babies.html','engagements/engagemainshow/engagementpictures.html','dance/dancepictures.html','artists/artists.html','portraits/portraits.html','seniors/highschoolseniors.html','weddings/weddings.html'], lnk_base:'', lnk_targets:['_iframe1', '_iframe1', '_iframe1', '_iframe1', '_iframe1', '_iframe1', '_iframe1' ], lnk_attr:['width=200,height=300,top=200,menubar=yes', 'width=300,height=200,left=400,scrollbars=yes', 'width=150,height=250,left=200,top=100', ''], titles:['Babies', 'Engagements', 'Dance', 'Artists', 'Portraits', 'HS Seniors', 'Weddings'], image_border_width:1, image_border_color:'#E3F0A1' });   </div> Any thoughts? -Stuart

    Read the article

1 2 3  | Next Page >