Jquery,JavaScript, vb net Исправлено в y и прокручивается в x Заголовок

Я разрабатываю приложение ASP .NET в VB с мастер-страницами и ContentPages. Мне нужно иметь фиксированный верхний заголовок, но чтобы иметь возможность прокручиваться вбок по оси 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>

Это моя главная страница.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? Я установил jscrollpane через Nugent

заранее спасибо

Источник

1 ответ

Решение

Мне удалось найти решение:

Я должен был добавить свой сценарий на страницу содержания в основном контенте И в то же время я пропал

     <!-- 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>
Источник
Другие вопросы по тегам