javascript - 可以使用slideup()函数在单击某些输入类型时向上滑动页面

标签 javascript jquery html jquery-ui jquery-mobile

我正在尝试在移动 JQuery 设计中的页面上实现幻灯片功能。就像当有人点击输入类型时,就会打开一个文本区域,但我希望整个页面向上滑动,并且该文本区域应该位于屏幕中央。

请参阅FIDDLE我所做的事情。我希望页面向上滑动一点。

<fieldset data-role="controlgroup" data-mini="true" style="color:#006699 !important">

<h4>Estoy interesado(a) En la propiedad, </h4>

    <input id="radio-choice-1" name="opcmessage" title="" type="radio" value="1" />
    <label for="radio-choice-1">favor de enviarme más información</label>
    <input id="radio-choice-2" name="opcmessage" title="" type="radio" value="2" />
    <label for="radio-choice-2">deseo visitarla</label>
    <input id="radio-choice-3" name="opcmessage" title="" type="radio" value="3" />
    <label for="radio-choice-3">envieme fotos</label>
    <input id="radio-choice-4" name="opcmessage" title="" type="radio" value="4" />
    <label for="radio-choice-4">envieme más fotos</label>
</fieldset>
<textarea name="textarea" id="textarea"></textarea>
<a data-rel="back" href="#pageone" data-icon="delete" data-inline="true" data-role="button" data-theme="c" title="Close">Cancelar</a>

<div style="float: right; margin-right: -10px;">
    <input class="me" data-theme="c" data-role="button" data-inline="true" type="submit" data-icon="search" id="im_send_message" name="im_send_message" value="Enviar" />
</div>

最佳答案

$(document).on("pagecreate", function () {
    $("#textarea").slideUp();
    $("[name=opcmessage]").on("change", function () {
        var text = $(this).closest("div").find("label").text();
        var str = "Estoy interesado(a) en la propiedad,";
        var text = str.concat(text);
        $("#textarea").text(text).slideDown();
        $(".me").closest("div").removeClass("ui-icon-search").addClass("ui-icon-check");
    });
});

用户“slideUp/slideDown”而不是“隐藏/显示”

关于javascript - 可以使用slideup()函数在单击某些输入类型时向上滑动页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23465748/

相关文章:

javascript - 使用 onload 附加图像

javascript - Vue 中未调用计算属性集

javascript - 将ajax请求的结果保存在类变量中

javascript - css3 动画和 jquery(悬停翻转卡)的视觉问题

javascript - 如何使用 jQuery 处理 "remove class"?

javascript - 创建一个动态存储数据的 html 页面

javascript - rails : Ajax for Like button when iterating through status updates

javascript - Select2 : Uncaught TypeError: options. 结果不是函数

html - 即使我说它向左浮动,或向右浮动,它仍然在另一行

javascript - 通过在 Shiny 中添加复选框使列动态化