将jQuery效果添加到移动设备 - 效果可在桌面/平板电脑上运行，但不适用于iPhone

Question

我刚刚建立了我的第一个严肃的网页，现在我注意到我放在iPhone上没有任何酷炫的jQuery效果。这个问题有一个简单的解决方案吗？

没有AJAX，效果主要用于隐藏/显示div并添加替换.val()。

如果这个问题过于笼统，那么请建议我在这个问题上阅读。感谢。

这是我的javascript / css加载头：

<link href='http://fonts.googleapis.com/css?family=Libre+Baskerville' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css/reset.css" />
<link rel="stylesheet" href="css/normalize.css" />
<link rel="stylesheet" href="css/styles.css" /> 

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<script src="javascript/application.js"></script>

以下是一些jquery的示例，请假设所有这些变量和方法都在application.js的桌面上工作：

    homeButton.on("click", function(){
    about.fadeOut(300);
    gallery.fadeOut(300);
    contact.fadeOut(300);
    rules.fadeOut(300);
    download.fadeOut(300);
    home.delay(300).fadeIn(300);
});

contactButton.on("click", function(){
    home.fadeOut(300);
    gallery.fadeOut(300);
    about.fadeOut(300);
    rules.fadeOut(300);
    download.fadeOut(300);
    contact.delay(300).fadeIn(300);
});

除此之外，我只是用vals做一些事情：

    nameBox.on("focus", function() {
    if ($(this).val() == 'Name') {
        $(this).val('');
    }
});
nameBox.on("blur", function() {
    if ($(this).val() == '') {
        $(this).val('Name');
    }
});