JQuery UI - вкладки внутри ограничения разрыва аккордеона - PullRequest
1 голос
/ 04 июня 2019

Я показываю код из книги и пытаюсь упорядочить его по главам.Главы 2-7 я выделил правильно и оформлен так, как хотелось бы.Если я разрешу главу 2, в которой я пытаюсь добавить вкладки в аккордеон, это нарушит ограничения на размер контента.В главе 1 я пытаюсь загрузить код, который будет выделен из других файлов, таких как другие главы, и отобразить их во вкладках, но я не могу выделить его, не нарушив правильную работу вкладок.Я новичок, так что это определенно не лучший способ.Спасибо за любую помощь и предложения.

Кстати, это не совсем то, что я вижу, так как я получаю страницы аккордеона из других файлов.Еще раз спасибо.

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>


<script type="text/javascript">

  $("#tabs2").tabs();
  $("#accordion").accordion({autoHeight:false,collapsible:true,"activate":false,heightStyle: "content",navigation: true});



  //$("#tabs").tabs();


  $.post("Blink.ino",function(postresult) {
    $("#pan1").append(postresult);
    $("#pan1").each(function (i, e) {
      hljs.highlightBlock(e);
    });
  });

  $.post("Ultimate_Machine.ino",function(postresult) {
    $("#pan1-2").append(postresult);
    $("#pan1-2").each(function (i, e) {
      hljs.highlightBlock(e);
    });
  });

  $.post("Twitter_Pet.ino",function(postresult) {
    $("#pan3").append(postresult);
    $("#pan3").each(function (i, e) {
      hljs.highlightBlock(e);
    });
  });

  $.post("Crystal_Ball.ino",function(postresult) {
    $("#pan4").append(postresult);
    $("#pan4").each(function (i, e) {
      hljs.highlightBlock(e);
    });
  });

  $.post("tardis.txt",function(postresult) {
    $("#pan5").append(postresult);
    $("#pan5").each(function (i, e) {
      hljs.highlightBlock(e);
    });
  });

  $.post("Train.ino",function(postresult) {
    $("#pan6").append(postresult);
    $("#pan6").each(function (i, e) {
      hljs.highlightBlock(e);
    });
  });

  $.post("tardis.txt",function(postresult) {
    $("#pan7").append(postresult);
    $("#pan7").each(function (i, e) {
      hljs.highlightBlock(e);
    });
  });
</script>

<!-- Highlight.js -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.8/styles/solarized-dark.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.8/highlight.min.js"></script>
<script>hljs.initHighlightingOnLoad();</script>
  <link href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" rel="stylesheet">
  <style type="text/css">
    #accordion .ui-accordion-content {
      max-height: 200px;
    }
  </style>
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
<h3>Arduino-LEGO-Projects-Jon-Lazar</h3>
<img src="./../SiteMaterial/books/LegoArduino/cover.jpg">
<img src="./../SiteMaterial/books/LegoArduino/android.png" />

<div id="accordion">
<!--
<h3><a href="#">Chapter 1</a></h3>
      <div id="tabs">
        <ul>
          <li><pre><code class="arduino" id="pan1"><a href="Blink.ino">
Мигает Конечная машина // Если главы 1 и 2 закомментированы, это выглядит идеально

Глава 2

<code class="arduino">
          // include the library for hobby servos
          #include <Servo.h>

          // DC hobby servo
          Servo servo1;

          // sets the constants for each of the sensor signal pins:
          const int pingPin[] = {2, 3, 4};

          // sets the increment counter for each sensor:
          int counter = 0;

          // sets the speed of the servo movement
          int spd = 10;

          // sets the left, right, and center positions of the servo
          int left = 10;
          int right = 170;
          int center = (right - left) / 2;

          // sets the variable to keep track of the servo angle
          int angle = center;

          void setup() {
            // initialize serial communication:
            Serial.begin(9600);

            // turn on servo and move to center
            servo1.attach(9);
            servo1.write(center);
          }

          void loop() {
            // establish variables for duration of the ping,
            // and the distance result in inches:
            long duration, inches;

            // resets counter if we run out of sensors
            if (counter == 3) counter = 0;

            // The PING))) is triggered by a HIGH pulse of 2 or more microseconds.
            // Give a short LOW pulse beforehand to ensure a clean HIGH pulse:
            pinMode(pingPin[counter], OUTPUT);
            digitalWrite(pingPin[counter], LOW);
            delayMicroseconds(2);
            digitalWrite(pingPin[counter], HIGH);
            delayMicroseconds(5);
            digitalWrite(pingPin[counter], LOW);

            // The same pin is used to read the signal from the PING))): a HIGH
            // pulse whose duration is the time (in microseconds) from the sending
            // of the ping to the reception of its echo off of an object.
            pinMode(pingPin[counter], INPUT);
            duration = pulseIn(pingPin[counter], HIGH);

            // convert the time into a distance
            inches = microsecondsToInches(duration);

            // moves the servo to the left if left sensor is triggered
            if (inches < 6 && counter == 0) {
              if (angle != left) {
                for (int i=angle; i>left; i--) {
                  servo1.write(i);
                  delay(spd);
                }
                angle = left;
              }

            // moves to the center if center sensor is triggered
            } else if (inches < 6 && counter == 1) {
              // moves from left to center
              if (angle < center) {
                for (int i=angle; i<center; i++) {
                  servo1.write(i);
                  delay(spd);
                }
              // or moves from right to center
              } else {
                for (int i=angle; i>center; i--) {
                  servo1.write(i);
                  delay(spd);
                }
              }
              angle = center;

            // moves to the right if right sensor is triggered
            } else if (inches < 6 && counter == 2) {
              if (angle != right) {
                for (int i=angle; i<right; i++) {
                  servo1.write(i);
                  delay(spd);
                }
                angle = right;
              }

            // otherwise hold steady at the current position
            } else {
              servo1.write(angle);
            }

            // send the value in inches to the Serial Monitor for each sensor
            Serial.print("Sensor ");
            Serial.print(counter);
            Serial.print(": ");
            Serial.print(inches);
            Serial.println(" inches");

            // increment counter for the next loop
            counter++;

            // short delay before starting over again
            delay(100);
          }

          long microsecondsToInches(long microseconds) {
            // According to Parallax's datasheet for the PING))), there are
            // 73.746 microseconds per inch (i.e. sound travels at 1130 feet per
            // second).  This gives the distance travelled by the ping, outbound
            // and return, so we divide by 2 to get the distance of the obstacle.
            // See: http://www.parallax.com/dl/docs/prod/acc/28015-PING-v1.3.pdf
            return microseconds / 74 / 2;
          }



        </code>
<code class="arduino">
            // sets the constants for the sensor and led signal pins:
            const int pingPin = 2;
            const int led = 10;

            void setup() {
              // initialize serial communication:
              Serial.begin(9600);

              // sets the LED pin to an output mode
              pinMode(led, OUTPUT);
            }

            void loop() {
              // establish variables for duration of the ping,
              // and the distance result in inches:
              long duration, inches;

              // The PING))) is triggered by a HIGH pulse of 2 or more microseconds.
              // Give a short LOW pulse beforehand to ensure a clean HIGH pulse:
              pinMode(pingPin, OUTPUT);
              digitalWrite(pingPin, LOW);
              delayMicroseconds(2);
              digitalWrite(pingPin, HIGH);
              delayMicroseconds(5);
              digitalWrite(pingPin, LOW);

              // The same pin is used to read the signal from the PING))): a HIGH
              // pulse whose duration is the time (in microseconds) from the sending
              // of the ping to the reception of its echo off of an object.
              pinMode(pingPin, INPUT);
              duration = pulseIn(pingPin, HIGH);

              // convert the time into a distance
              inches = microsecondsToInches(duration);

              // turn on the led if object is within six inches
              if (inches < 6) {
                 digitalWrite(led, HIGH);
              } else {
                digitalWrite(led, LOW);
              }

              // send the value in inches to the Serial Monitor
              Serial.print(inches);
              Serial.println(" inches");

              // short delay before starting over again
              delay(100);
            }

            long microsecondsToInches(long microseconds) {
              // According to Parallax's datasheet for the PING))), there are
              // 73.746 microseconds per inch (i.e. sound travels at 1130 feet per
              // second).  This gives the distance travelled by the ping, outbound
              // and return, so we divide by 2 to get the distance of the obstacle.
              // See: http://www.parallax.com/dl/docs/prod/acc/28015-PING-v1.3.pdf
              return microseconds / 74 / 2;
            }


        </code>
<code class="arduino">
            // sets the constants for each of the sensor and led signal pins:
            const int pingPin[] = {2, 3, 4};
            const int led[] = {10, 11, 12};

            // sets the increment counter for each sensor:
             int counter = 0;

            void setup() {
              // initialize serial communication:
              Serial.begin(9600);

              // sets each LED pin to an output mode
              for (int i=0; i<3; i++) pinMode(led[i], OUTPUT);
            }

            void loop() {
              // establish variables for duration of the ping,
              // and the distance result in inches:
              long duration, inches;

              // resets counter if we run out of sensors
              if (counter == 3) counter = 0;

              // The PING))) is triggered by a HIGH pulse of 2 or more microseconds.
              // Give a short LOW pulse beforehand to ensure a clean HIGH pulse:
              pinMode(pingPin[counter], OUTPUT);
              digitalWrite(pingPin[counter], LOW);
              delayMicroseconds(2);
              digitalWrite(pingPin[counter], HIGH);
              delayMicroseconds(5);
              digitalWrite(pingPin[counter], LOW);

              // The same pin is used to read the signal from the PING))): a HIGH
              // pulse whose duration is the time (in microseconds) from the sending
              // of the ping to the reception of its echo off of an object.
              pinMode(pingPin[counter], INPUT);
              duration = pulseIn(pingPin[counter], HIGH);

              // convert the time into a distance
              inches = microsecondsToInches(duration);

              // turn on the led if object is within six inches
              if (inches < 6) {
                 digitalWrite(led[counter], HIGH);
              } else {
                digitalWrite(led[counter], LOW);
              }

              // send the value in inches to the Serial Monitor for each sensor
              Serial.print("Sensor ");
              Serial.print(counter);
              Serial.print(": ");
              Serial.print(inches);
              Serial.println(" inches");

              // increment counter for the next loop
              counter++;

              // short delay before starting over again
              delay(100);
            }

            long microsecondsToInches(long microseconds) {
              // According to Parallax's datasheet for the PING))), there are
              // 73.746 microseconds per inch (i.e. sound travels at 1130 feet per
              // second).  This gives the distance travelled by the ping, outbound
              // and return, so we divide by 2 to get the distance of the obstacle.
              // See: http://www.parallax.com/dl/docs/prod/acc/28015-PING-v1.3.pdf
              return microseconds / 74 / 2;
            }

          </code>

Глава 3

<code class="arduino" id="pan3"></code>

Глава 4

<code class="arduino" id="pan4"></code>

Глава 5

<code class="arduino" id="pan5"></code>

Глава 6

<code class="arduino" id="pan6"></code>

Глава 7

<code class="Arduino">
      #include <AFMotor.h>

      // Connect a stepper motor with 48 steps per revolution (7.5 degree)
      // to motor port #1 (M1 and M2)
      AF_Stepper motor(48, 1);

      int photocellPin = A0;     // the cell and 10K pulldown are connected to a0
      int photocellReading;     // the analog reading from the sensor divider
      int threshold = 200; // the amount of light required to activate the motor

      void setup() {
        Serial.begin(9600);           // set up Serial library at 9600 bps

        motor.setSpeed(50);  // 50 rpm
      }

      void loop() {
          photocellReading = analogRead(photocellPin);

        Serial.print("Photocell reading = ");
        Serial.println(photocellReading);     // the raw analog reading

        if (photocellReading > threshold) {
          motor.step(100, FORWARD, INTERLEAVE);
        }


        delay(100);
      }
     </code>
...