🎄teratailクリスマスプレゼントキャンペーン2024🎄』開催中!

\teratail特別グッズやAmazonギフトカード最大2,000円分が当たる!/

詳細はこちら
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

Q&A

1回答

3343閲覧

ハンバーガーメニューからページ外リンクへと飛ばない

karakara77

総合スコア4

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

0グッド

0クリップ

投稿2019/12/03 09:01

編集2019/12/04 04:07

HTML/CSS/javaに関する質問です。
以下のリンクにございますテンプレートを利用してページ作成しています。ハンバーガーメニュー(レスポンシブでPCサイズだと展開無しで横並びになります。)
の各項目のもともと記述されていた<a href>内に外部リンクを記述したところ一切ジャンプしません…テンプレートだと#からはじまるページ内リンクに対応しているようなのですが、外部リンクを設置したところ飛びませんでした。当方、コーディングやプログラミングは全くの初心者なので、あてずっぽうな予想ですがリンク先が#から始まるものでないとjavaが反応しないのかなど考えておりますが、HtmlとCSSの浅い知識だけしか持ち合わせておりませんので分からずじまいで大変困っております。
ご迷惑をおかけいたしますがどなたかお力添えをいただけないでしょうか。
よろしくお願い申し上げます。

リンク:
http://pixelhint.com/demo/volcano/

ファイル名:index.html

Html一部抜粋

1<!doctype html> 2<html class="no-js" lang="en"> 3 <head> 4 <meta charset="utf-8" /> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0" /> 6 <title>Volcano - Free Responsive HTML5/CSS3 Zurb Foundation Template</title> 7 8 <!-- Stylesheet Files --> 9 <link rel="stylesheet" href="css/normalize.css" /> 10 <link rel="stylesheet" href="css/foundation.min.css" /> 11 <link rel="stylesheet" href="css/main.css" /> 12 13 <!-- Javascript files are placed before </body> --> 14 </head> 15 16 <body> 17 <!-- Start Hero Section --> 18 <section class="hero"> 19 <header> 20 <div class="row"> 21 22 23 <nav class="top-bar" data-topbar role="navigation"> 24 25 <!-- Start Logo --> 26 <ul class="title-area"> 27 <li class="name"> 28 <a href="#" class="logo"> 29 <h1>volcano<span class="tld">.com</span></h1> 30 </a> 31 </li> 32 <span class="toggle-topbar menu-icon"><a href="#"><span>Menu</span></a></span> 33 </li> 34 </ul> 35 <!-- End Logo --> 36 37 <!-- Start Navigation Menu --> 38 <section class="top-bar-section" id="mean_nav"> 39 <ul class="right"> 40 <li><a href="#services">services</a></li> 41 <li><a href="#testimonials">Testimonials</a></li> 42 <li><a href="#Download">Download</a></li> 43 <li><a href="#connect">Connect</a></li> 44 </ul> 45 </section> 46 <!-- End Navigation Menu --> 47 48 </nav> 49 </div> 50 </header> 51 52 <!-- Start Hero Caption --> 53 <section class="caption"> 54 <div class="row"> 55 <h1 class="mean_cap">Responsive Template</hA> 56 <h2 class="sub_cap">Less Is More.</h2> 57 <a href="#" class="btn_details"><span>More Details</span> <img src="img/btn_arrow.png" alt="" src="" class="arrow"></a> 58 </div> 59 </section> 60 <!-- End Hero Caption --> 61 62 </section> 63 <!-- End Hero Section --> 64 65 66 67 68 69 <!-- Javascript Files --> 70 <script src="https://maps.googleapis.com/maps/api/js?v=3.exp"></script> 71 <script type="text/javascript" src="js/jquery.js"></script> 72 <script type="text/javascript" src="js/touchSwipe.min.js"></script> 73 <script type="text/javascript" src="js/easing.js"></script> 74 <script type="text/javascript" src="js/foundation.min.js"></script> 75 <script type="text/javascript" src="js/foundation/foundation.topbar.js"></script> 76 <script type="text/javascript" src="js/carouFredSel.js"></script> 77 <script type="text/javascript" src="js/scrollTo.js"></script> 78 <script type="text/javascript" src="js/map.js"></script> 79 <script type="text/javascript" src="js/main.js"></script> 80 81 </body> 82</html> 83

ファイル名:main.js

JavaScript(main.js)

1$(document).ready(function(){ 2 3 4 /* Foundation Init */ 5 $(document).foundation(); 6 7 8 9 /* carousel Init */ 10 $('#carousel').carouFredSel({ 11 width : '670', 12 pagination : ".pagination", 13 responsive : true, 14 scroll :{ 15 fx : 'fade' 16 }, 17 items :{ 18 visible : 1, 19 width : '670' 20 }, 21 swipe: { 22 onMouse: true, 23 onTouch: true 24 } 25 }); 26 27 28 29 30 31 /* Mean navigation menu scroll to */ 32 $('#mean_nav ul li a').click(function(e){ 33 e.preventDefault(); 34 scrollTo($(this).attr('href'), 900, 'easeInOutCubic'); 35 }); 36 37 38 39 40 41 42 /* Back to top button */ 43 var back_top = $('#back_top'); 44 45 back_top.click(function(e){ 46 e.preventDefault(); 47 scrollTo(0, 900, 'easeInOutCubic'); 48 49 }); 50 51 function scrollTo(target, speed, ease){ 52 $(window).scrollTo(target, speed, {easing:ease}); 53 } 54 55 $(window).on('scroll', function(){ 56 if($(this).scrollTop()>749) 57 { 58 back_top.stop().animate({opacity : 1}, 250); 59 }else 60 { 61 back_top.stop().animate({opacity : 0}, 250); 62 } 63 }); 64 65});

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

kei344

2019/12/03 09:20

(質問文は編集できます)「JAVA」と「JavaScript」は別言語です。質問タグ及び質問本文を修正されることをお勧めします。
退会済みユーザー

退会済みユーザー

2019/12/03 09:26

作成しているコンテンツのコード類を質問文中にありのまま貼り付けることでアドバイスなど指摘しやすくなるのですが。屏風の中のトラを捕まえるには、まず屏風からトラを追い出していただかないと。
takepan1973

2019/12/04 00:04

PHP関係ないのであれば、タグ外してください。
退会済みユーザー

退会済みユーザー

2019/12/04 03:05

teratailに慣れていないのだと察しますが、第三者が再現するために、それぞれのコードをどういうファイル名でおけばいいか、っていう指定もほしいです。で、ハンバーガーメニューのどこがどうなのか、スクショなど駆使して説明があるとアドバイスが得られやすくなるかと。
karakara77

2019/12/04 04:09

m6u様 おっしゃるとおり不慣れの中、的確なご助言を頂きましてありがとうございます。 問題解決に向けてこちらでもできるかぎりのことをさせていただきたい思っておりますので、不足分の情報に関しましてはぜひともご要望いただければと思います。 どうぞよろしくお願い致します。
kei344

2019/12/04 08:31

「ハンバーガーメニュー」はどの要素で、「ページ外リンク」はどの要素でしょうか。(ページ外にリンクする要素が提示のHTMLに見当たらない)また、質問本文内に「JAVA」が残っていますので、そこも編集お願いします。
guest

回答1

0

まぁ、コードを見る気がしないからみてないけど。

もし、質問者さんのコードがあってて質問者さんがいうような挙動が起こっているなら
おそらく何処かにページ移動を阻止するJavaScriptがあるんじゃないんですか?

コードを見せてもらえないとなんとも言えませんが

投稿2019/12/03 14:05

編集2019/12/03 14:06
kyoya0819

総合スコア10429

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

karakara77

2019/12/04 04:12

ご回答ありがとうございます。 情報が不足しておりまして申し訳ございませんでした。 自分なりに関連性の高いと思われるコードを追記いたしました。 また不足した情報がございましたらご助言いただけると幸いです。 どうぞよろしくお願い致します。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.36%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問