Jump to content

Ingolme

Moderator
  • Posts

    14,894
  • Joined

  • Last visited

  • Days Won

    176

Posts posted by Ingolme

  1. You're copying the entire document into the div, which includes a copy of the div itself. Two divs means two green borders stacked on top of each other.

    This is the document before clicking:

    <!DOCTYPE html>
    <html>
       <body>
          <div id="div1"  ondblclick="myFunction()" contenteditable="true" 
             style="width: 300px; height: 400px; border: 2px solid green;">    
             You can Click me once . then edit me ..or.. <br>take a chance on DoubleClick ..
          </div>
          <script>
             let x;
             function myFunction() {
    		  x = document.documentElement.outerHTML ;
             alert(x);
             document.getElementById("div1").innerHTML = x;
             }
          </script>
       </body>
    </html>

    This is the document after you doubleclick:

    <!DOCTYPE html>
    <html>
       <body>
          <div id="div1"  ondblclick="myFunction()" contenteditable="true" style="width: 300px; height: 400px; border: 2px solid green;">
    
              <html>
                 <body>
                    <div id="div1"  ondblclick="myFunction()" contenteditable="true" 
                       style="width: 300px; height: 400px; border: 2px solid green;">    
                       You can Click me once . then edit me ..or.. <br>take a chance on DoubleClick ..
                    </div>
                    <script>
                       let x;
                       function myFunction() {
                        x = document.documentElement.outerHTML ;
                       alert(x);
                       document.getElementById("div1").innerHTML = x;
                       }
                    </script>
                 </body>
              </html>
    
          </div>
          <script>
             let x;
             function myFunction() {
    		  x = document.documentElement.outerHTML ;
             alert(x);
             document.getElementById("div1").innerHTML = x;
             }
          </script>
       </body>
    </html>

    This is the document

  2. This line of code is outside of the loop:

    console.log("Target = " + Target[i]);

    For that reason, The variable i does not yet have a value and the result is undefined.

     

    if (i.hasAttribute("target")) {

    The above line is incorrect. The variable i is just a number between 0 and the number of links, so it doesn't have a hasAttribute method.

    You should be calling hasAttribute on the element Target[i]

     

    I anticipate further questions about these explanations, so I'll just write functioning code below:

    <script>
      function ATargetHtml() {
        // Declare Target inside the function to guarantee that the list of links is up to date
        let Target = document.getElementsByTagName('A');
        console.log(" let Target = document.getElementsByTagName('A');")
    
        for (var i = 0; i < Target.length; i++) {
          // Show the current target element in the console
          console.log("Target = ", Target[i]);
          
          // Replaced "i" with "Target[i]"
          if (Target[i].hasAttribute("target")) {
            Target[i].setAttribute("target", "_self");
          }
        }
      }
    </script>

     

  3. It means that the path is wrong.

    I don't know how your filesystem is structured, so I can only guess what the path really should look like.

    Maybe this will work:

    <img src="images/1.jpg">

    Starting a path with a "/" makes the path be relative to the root of the website, not the current folder.

    • Like 1
  4. I think the difference will become apparent once multiple instances are created. Try it out and see what happens.

    public class PrivateStatic {
    
        private static int x =2;
        private int y=6;
    
        public PrivateStatic (int newX, int newY){
            x = newX;
            y = newY;
        }
    
        public PrivateStatic (){}
    
        public void print(){
            System.out.println(x);
            System.out.println(y);
            System.out.println("---");
        }
    
        public static void main(String[] args){
            PrivateStatic obj1 = new PrivateStatic(10,40);
            PrivateStatic obj2 = new PrivateStatic(11,41);
            PrivateStatic obj3 = new PrivateStatic(12,42);
        	obj1.print();
        	obj2.print();
        	obj3.print();
        }
        
    }

     

  5. Pitch control is not one of the default controls of the <audio> element, so any code which can do it will be complicated.

    The Web Audio API is a powerful tool for generating and manipulating audio signals, but it is complicated. I can't just give you code to use because it would take a few hours of my time. The BiquadFilterNode should be able to alter the pitch of a signal passing through it.

  6. CSS only selects downwards and forwards so that the rendering engine only needs to do a single pass through the HTML document.

    What you have to do is find the closest ancestor with a class or ID and reach the div through a series of child and element selectors. The resulting selector might look something like this:

    .something > section:nth-child(2) > div:nth-child(4)

  7. Because of collapsing margins, the default margins on the <h1> tag are extending out of its container. If you set the margin of the <h1> to zero it will fix that.

    For testing CSS, you should be using the developer tools in your browser, usually available by pressing the F12 key on the keyboard. It will show you all the elements and which styles are affecting them. It will visually display the padding margins and borders.

    In CSS, decimal numbers use the point "." instead of a comma ",". It should be flex-grow: 2.5;

    • Like 1
  8. That's because the links are wider than the container. You have set the width to 100%, then added 16px if padding to the left and another 16px of padding to the right. The result is that the link is exceeding the width of the container by 32 pixels.

    This can be fixed by removing width:100%; from the stylesheet. It's not needed because block elements automatically grow to fit their container.

    The last link in the list is going to have a problem because you have set its value to float:right in the HTML in a style attribute, so the media query can't override it. You have to move that CSS rule out of the HTML and into the stylesheet.

    • Like 1
  9. The problem in that screenshot is that you've set the width of those options to 300px, so it is not permitted to get any smaller.

    Delete this from your stylesheet:

    .charitable-donation-form .donation-amounts .donation-amount {
        height: 150px;
          width: 300px;
        color: #000000;;
        border: 0;
        background-color: #ababab;
        border-radius: 99px;
        padding: 2px;
        text-align: center;
          margin: 6px;
    }

    And also this:

    ul.donation-amounts {
        width: 300px;
    }

    • Like 1
×
×
  • Create New...