Are the external links not 'loading'? (by clicking with the left mouse button)

Navigation
0

Good evening,

I'm setting up a landingpage for a Retreat that will happen in my church, I'm working with (middleman / frameworks [bootstrap] / HTML slim [ruby] / heroku), I'm creating a default link, more when I left-click it does not load the link anymore when I right click and open in new tab, load normally?

note: "Internal link is working normally"

Thank you in advance for your attention.

Page link - > link

link to the project's GitHub - > link

Follow the Code: 

  /! contatos
  #contato.scroll
  .box2
    .container
      center
        .row
          br
          h2 Contato
          br
          br
          br
          br
          .col-md-3
            i.fa.fa-envelope.fa-4x
            br
              h4 [email protected]
          .col-md-3
            i.fa.fa-phone.fa-4x
            br
              h4 41 9658-7321
          .col-md-3
            i.fa.fa-whatsapp.fa-4x
            br
              h4 41 9658-7321
          .col-md-3
            a href="https://www.facebook.com/conexaototalibi"
              i.fa.fa-facebook-square.fa-4x
              br
                h4 conexaototalibi
        br
        br
        i.fa.fa-arrow-circle-o-up
        a.scroll href="#home" <b>  voltar ao topo</b>
    
asked by anonymous 03.04.2015 / 01:59

1 answer

1

I discovered, when using 

$(".scroll").click(function(event){
    event.preventDefault();

All elements with class="scroll" have been affected and child elements too, you have applied the .scroll class to several elements that are not links, for example:

  • #home.scroll ( <div id="home" class="scroll"> )
  • #oquee.scroll ( <div id="oquee" class="scroll"> )
  • section#local.scroll ( <section id="local" class="scroll"> )
  • #convidado.scroll ( <div id="convidado" class="scroll"> )
  • #contato.scroll ( <div id="contato" class="scroll"> )

event.preventDefault runs on all these elements and their children.

Solution 1

Instead of using the $(".scroll") selector, use $("a.scroll") , something like: 

  jQuery(document).ready(function($) {
    $("a.scroll").click(function(event){
      event.preventDefault();
      $('html,body').animate({scrollTop:$(this.hash).offset().top}, 800);
    });
  });
Solution 2

But if there are elements that are not anchors ( <a> ) then remove the class="scroll" from unnecessary elements, such as those already mentioned: #home.scroll , #oquee.scroll , section#local.scroll , #convidado.scroll

Another problem (not directly related to the reported problem) is that you have added jQuery twice, they may be conflicting and triggering a number of problems: 

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script><!--Includeallcompiledplugins(below),orincludeindividualfilesasneeded--><scriptsrc="js/bootstrap.min.js"></script><!--scroll--><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"type="text/javascript"></script>

So I understand you include the jQuery version #contato.scroll and then along with the scroll code you added the version 1.11.0 , I recommend removing this version (since it is already quite old): 

 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"type="text/javascript"></script>

This is causing problems like:

  

Mixed Content: The page at ' link '   was loaded over HTTPS, but requested an insecure script   ' link '.   This request has been blocked; the content should be served over HTTPS.

    
05.04.2015 / 22:35
Select deleting another Select Add Arrays with php