2

マスター ページと ContentPages を使用して vb で ASP .NET アプリケーションを開発しています。トップヘッダーを固定する必要がありますが、x 軸を横にスクロールできるようにするには、ここで問題の解決策を見つけました 解決策赤い左の境界線をなくしたい

しかし、私の本当の問題は、マスターページとコンテンツページを使用しているため、このコードをどこに配置すればよいかわからないという事実です

 $(document).ready(function() {
 $('#parent')
 .bind('jsp-scroll-y',
  function(event, scrollPositionY, isAtTop, isAtBottom) {
    $(".header").css("top", scrollPositionY);
   }
  )
  .bind('jsp-scroll-x',
  function(event, scrollPositionX, isAtLeft, isAtRight) {
     $(".lefter").css("left", scrollPositionX);
   }
 )
  .jScrollPane();
 });

今、私は自分の Site.Master ページにそれを持っていますが、アプリを実行しても何も起こりません

私のヘッダーはコンテンツページにあります

これは私のコンテンツページです: <%@ Page Title="" Language="vb" AutoEventWireup="false" MasterPageFile="~/Site.Master" CodeBehind="TestPage.aspx.vb" Inherits="Test.WebForm1" %> 

  <p>Test</p>
     <div id="parent">
 <div class="headerx">header</div>
    <div class="wrapper">
 <div class="lefter">leftpane</div>
 <div class="content">mycontent</div>
     </div>
  <div class="scrollarea">

    </div>
    </div>

   </asp:Content>

これは、コード ビハインドのないマスター page.aspx です。

  <%@ Master Language="VB" AutoEventWireup="false" CodeBehind="Site.master.vb" Inherits="Test.Site" %>

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
 <head runat="server">
<title>APPLICATION WEB POUR TESTER</title>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript">
   $(document).ready(function() {
  $('#parent')
        .bind('jsp-scroll-y',
            function(event, scrollPositionY, isAtTop, isAtBottom) {
                $(".header").css("top", scrollPositionY);
    }
         )
        .bind('jsp-scroll-x',
            function(event, scrollPositionX, isAtLeft, isAtRight) {
                $(".lefter").css("left", scrollPositionX);
    }
   )
    .jScrollPane();
   });

 </script>
  <script type="text/javascript">
      function invokeMeMaster() {
          alert('I was invoked from Master');
       }
    </script>



     <script type="text/javascript">
    function invokeMeMasterOnclick() {
        alert('I was invoked from a ButtonClick');
    }
    </script>
  <link href="~/Styles/Site.css" rel="stylesheet" type="text/css" />

    <asp:ContentPlaceHolder ID="HeadContent" runat="server"> 
    </asp:ContentPlaceHolder>
      </head>
     <body>

jscriptをどこでどのように呼び出す必要がありますか? nugent経由でjscrollpaneをインストールしました

前もって感謝します

4

1 に答える 1

0

私は解決策を見つけることができました：

メインコンテンツのコンテンツページにスクリプトを追加する必要があり、同時に行方不明でした

     <!-- styles needed by jScrollPane -->
   <link type="text/css" href="Styles/jquery.jscrollpane.css" rel="stylesheet" media="all" />

     <!-- latest jQuery direct from google's CDN -->
   <script type="text/javascript"  src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">
     </script>

   <!-- the mousewheel plugin - optional to provide mousewheel support -->
  <script type="text/javascript" src="Scripts/jquery.mousewheel.js"></script>

      <!-- the jScrollPane script -->
     <script type="text/javascript" src="Scripts/jquery.jscrollpane.min.js"></script>

また

スクリプトは次のように宣言の下に追加する必要がありました

 <script type="text/javascript">
 $(document).ready(function () {
    $('#parent')
        .bind('jsp-scroll-y',
            function (event, scrollPositionY, isAtTop, isAtBottom) {
                $(".header").css("top", scrollPositionY);
            }
         )
        .bind('jsp-scroll-x',
            function (event, scrollPositionX, isAtLeft, isAtRight) {
                $(".lefter").css("left", scrollPositionX);
            }
    )
   .jScrollPane();
  });
  alert('I was invoked at the end of the script');
 </script>
 <script type="text/javascript">
     function invokeMeMaster() {
        alert('I was invoked from Master');
    }
  </script>
于 2013-10-04T18:24:09.967 に答える