jquery在页面加载时不起作用

时间:2012-06-09 09:24:10

标签: jquery html

我在我的网站中插入了一个小jQuery代码,左右修复了导航图标。问题是它只有在调整bowser窗口大小时才有效,但它应该在文档加载后放置图标...在这里你可以看到这个在行动(匈牙利语):utravalo.com

此代码适用于我的其他网站,没有问题。我有点困惑...... :)

这是jquery代码:

if (jQuery) {
  /* obtain jQuery instance */
  $sdv = jQuery.noConflict();

  /* ensure the links look & feel consistent */
  var formatLink = function (strEl) {
          var pEl = $sdv(strEl);
          if (pEl.length > 0) {
              pEl.children().children().css('color', '#3D536C');
              pEl.children().children().hover(

              function () {
                  $sdv(this).css('color', '#444444');
              }, function () {
                  $sdv(this).css('color', '#3D536C');
              });
          }
      }
  formatLink("#divPrev");
  formatLink("#divNext");

  var fnModifyNavigation = function () {
          /* obtain window's width */
          var w = $sdv(window).width();
          var hw = (w - 1020) / 2;
          if (hw > 100) {
              /* we have enough space for the fixed postion links */
              jQFPL($sdv("#divPrev"), 'left', 0, hw);
              jQFPL($sdv("#divNext"), 'right', 0, hw);
              $sdv("#divPostNav").hide();
          } else {
              /* not enough space for the fixed postion links */
              var divNav = $sdv("#divPostNav");
              if (divNav.length > 0) {
                  if (divNav.css('display') == 'none') {
                      divNav.show();
                      divNav.prepend(jQSPL("#divNext", "right"));
                      divNav.prepend(jQSPL("#divPrev", "left"));
                  }
              }
          }
      }

      /* jQuery Fixed Position Link */
  var jQFPL = function (el, remClass, absPosPX, width) {
          var pEl = el.detach();
          if (pEl) {
              pEl.removeClass(remClass);
              eval("var objStyle = { 'position':'fixed', 'top':'250px', 'width': '" + width + "px', '" + remClass + "':'" + absPosPX + "px', 'text-align':'" + remClass + "'};");
              pEl.css(objStyle);
              pEl.appendTo("body");
          }
      }

      /* jQuery Static Position Link*/
  var jQSPL = function (strEl, strFloat) {
          var el = $sdv(strEl).detach();
          el.css('position', 'static');
          el.css('width', '50%');
          el.css('float', strFloat);
          return el;
      }

      /* run position modification routine after the document is loaded */
      $sdv(fnModifyNavigation);

     /* handle the window's resize event and run position modification routine again */
     $sdv(window).resize(fnModifyNavigation);
}

感谢您的帮助!!

2 个答案:

答案 0 :(得分:1)

你想在jQuery ready方法中运行modify nav和formatLink函数(这等待加载html):

$sdv(document).ready(
    function(){

        formatLink("#divPrev");
        formatLink("#divNext");

        /* run position modification routine
        after the document is loaded */
        $sdv(fnModifyNavigation);  

        /* handle the window's resize event
        and run position modification routine again */
        $sdv(window).resize(fnModifyNavigation);
    }
);

答案 1 :(得分:0)

修改最后一行

$sdv(window).resize(fnModifyNavigation);

$sdv(window).resize(fnModifyNavigation).resize();