zoukankan      html  css  js  c++  java
  • 通过offset值的设置使html元素对齐

    今天是我第一次写这个随笔,为了记录我发现的一个jquery的offset的值的问题。

    这个offset的值会因为页面标签是否处于隐藏状态而表现出不同的值,隐藏状态时,offset的值是相对于直接父亲的,显示状态时,offset的值是相对于整个页面的。

    一开始的时候我为了把下拉列表与inputtext左对齐,设置offset值后再改变为显示状态,总也对不齐,总觉得获取的inputtext的offset().left的值很大,后来才发现是相对对象不同导致的,把offset的值在显示后再更改,终于好了。

    <s:decorate id="AlarmTypeDec" template="../../layout/edit.xhtml">
    <ui:define name="label">
    <s:label for="AlarmType">告警类型:</s:label>
    </ui:define>
    <script>
    function showlist(){
    $(".text").attr("size", 5);
    $(".text").attr("multiple", "multiple");
    $(".text").css("height", "auto");
    $(".text").css("overflow-y", "scroll");
    $(".text").removeClass("hidden");
    var aaa = $(".text-show").offset().left;
    $(".text").offset({left: aaa});
    }
    function showvalue(){
    var aaa = $(".text").find("option:selected").text();
    var bbb = $(".text").val();
    $(".text-show").val(aaa);
    }
    </script>
    <h:inputText id="resUrl" required="true" maxlength="128" size="60"
    value="请选择" readonly="readonly" styleClass="text-show">
    <a:ajax event="click" oncomplete="showlist();"
    render="AlarmTypeDec" />
    </h:inputText><br/>
    <h:selectOneMenu id="AlarmType" required="true" styleClass="text hidden"
    value="#{resourceAction.newResource.category.id}">
    <f:selectItems value="#{categorySelectList}" />
    <a:ajax event="change" execute="@this" render="AlarmTypeDec" oncomplete="showvalue();"/>
    </h:selectOneMenu>
    </s:decorate>

  • 相关阅读:
    spring security注解(1)
    替换localhost:8080(假域名,本地使用)
    java线程
    总结正则表达式
    试卷袋封面打印项目总结--重构项目总结
    试卷袋封面打印项目总结--兼容处理
    05 http状态码
    01HTTP的前世今生
    人人都看得懂的正则表达式教程
    Chrome 开发者工具(DevTools)中所有快捷方式列表
  • 原文地址:https://www.cnblogs.com/LcxSummer/p/5549429.html
Copyright © 2011-2022 走看看