I'm trying to create a website using Visual Studio 2015 with Bootstrap and HTML but so far, the code I have doesn't run and I get an error message.
]
Iv'e also been following the instructions on this site: HTMLGoodies.com
Here is the code I have so far:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Time Entry</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link rel="stylesheet" href="bootstrap.min.css" />
<script src="bootstrap.min.js"></script>
<link rel="stylesheet" href="bootstrap-theme.min.css" />
</head>
<body>
<form id="form1" runat="server">
<div class="container-fluid">
<h1>Logo Book</h1>
<p>Discover Artists and Shape Your Perfect Logo</p>
</div>
<div class="row">
<div class="col-md-4" style="background-color:blue;">
Welcome to Logo Book where you can browse through potyfolios of your prefered artist and see what they have to offer.
</div>
<div class="col-md-4" style="background-color:palegoldenrod;">
Looking for an easier way to get in touch with these artists and give specific details needed for your project?
</div>
<div class="col-md-4" style="background-color:coral;">
Feel free to use our Q&A section to voice and submit your needs such as fonts and images!
</div>
</div>
</form>
</body>
</html>
I ran this exact code on my computer, and it ran just fine. How are you trying to run this code? The easiest way to test if the code works is to type it in .html file, and open it with your browser.
The code works fine in .aspx page also. On creating new web application, Global.asax page doesn't contains line numbers 2,3 and 4. To run the page just remove them and run it. It will definately run. If you want to use that line no 2 then please describe your purpose for writing that line in detail. So we can find the solution according to it.
Related
I need help. I am just a beginner in writing web pages, so I hope my question isnt silly. The problem is, that my page doesnt load on a first attempt on a mobile device. (On desktop PC it works normally). I will give you a little background, what steps I made before this problem happened.
I have created websites with lightbox script loading at the start of the page. (I have adjusted the script to work in lower resolutions on mobile phones first) It made it work not properly, when it was opened on a mobile device. The windows were not fitting well on the screen etc..
I have solved this by putting the script at the end of html body. The lightbox works well now, but the page with the gallery doesnt open on a first attempt. I have to refresh the page and then the page appears normally and works without problems.
I have been searching for possible solution to this problem through the whole web, but with no success.
I am attaching my code (I have avoided some metatags, paragraphs with text, navigating toolbar etc. to shorten it and make it easier for you to read it and decode the problem.
I will be glad for any help I can get. :) Thanks a lot. Please, let me know on my e-mail, when answered or a problem with my question.
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width" />
<title>...</title>
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />
<link rel="canonical" href="http://www.merryberry.eu/galerie.html">
<link href="jquery-mobile/jquery.mobile.theme-1.3.0.min.css" rel="stylesheet" type="text/css">
<link href="jquery-mobile/jquery.mobile.structure-1.3.0.min.css" rel="stylesheet" type="text/css">
<link href="stylesheetmobil.css" rel="stylesheet" type="text/css">
<script src="jquery-mobile/jquery-1.11.1.min.js"></script>
<script src="jquery-mobile/jquery.mobile-1.3.0.min.js"></script>
</head>
<body>
<div class="Body">
<div class="header">
<div class="menu">
<nav id="primary_nav_wrap"> </nav>
</div>
</div>
<div class="picture">
<img src="Images/barvenidekorace.jpg" style="width: 100%; height: auto;">
</div>
<div class="text"></div>
<div class="footer"></div>
</div>
<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
</body>
</html>
So I was trying to simplify my header and somehow now my local jquery file doesn't load anymore. Other js files load fine but not jquery (i checked with Chrome's DevTools source section).
So I made a test file with a header stripped of most useless things to show you :
<html class="no-js" lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Non-Conformité</title>
<link rel="stylesheet" href="stylesheets/app.css" />
<script type="text/javascript" scr="../bower_components/modernizr/modernizr.js"></script>
<script type="text/javascript" scr="http://{InternalCompanyServer}/nonConforme/bower_components/jquery/dist/jquery.js"></script>
<script type="text/javascript" scr="bower_components/jquery/dist/jquery.js"></script>
<script scr="js/jquery.js"></script>
<script type="text/javascript" src="bower_components/foundation/js/foundation.js"></script>
</head>
<body>
<div class="row topMargin" header>
<img class='small-3 columns logo hide-on-print' src="img/logo-fr.png"/>
<h2 class='small-9 columns' >Formulaire Non-Conformité</h2>
</div>
<div class="row"></div>
</body>
As you can see I tried multiple ways to write the link : Absolute then Relative, I even copied the jquery file to the js folder and tried to link it but no luck.
The foundation.js file just after it loads fine but it gives the : "foundation.js:703 Uncaught ReferenceError: jQuery is not defined(…)" Error. Comment if you need more info I didn't think of putting here.
you put scr forjQuery url instead of src ;)
Edit> just a reflex : https://validator.w3.org/check
Go to direct input, paste you html... and let' go : Line 7, Column 40: there is no attribute "SCR"
I am trying to add a simple carousel to my site. After doing a little research I found owl.carousel.js, I like the layout they use and it seems to be what I'm looking for.
Keep in mind I am new at all this. :)
My question is after I have downloaded the file and add the links to my html how do I make it work? Also I am not sure if I have to add the JS in the html or separate like I have it. On the owl site it just says call the function.
$(document).ready(function(){
$(".owl-carousel").owlCarousel();
});
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<a link href="main.css" rel="stylsheet" type="text/css">
<link rel="stylesheet" href="owlcarousel/owl.carousel.min.css">
<link rel="stylesheet" href="owlcarousel/owl.theme.default.min.css">
<title></title>
</head>
<body>
<div class="owl-carousel">
<div> <img src="images/images-1.jpeg"> </div>
<div> <img src="images/images-2.jpeg"> </div>
<div> <img src="images/images-3.jpeg"> </div>
<div> <img src="images/images.jpeg"> </div>
<div> <img src="images/shutterstock_204805573.jpg"> </div>
<div> <img src="images/shutterstock_221107753.jpg"> </div>
<div> <img src="images/smug%20mug%20portrait%20copy.jpg"> </div>
</div>
<script src="jquery.min.js"></script>
<script src="owlcarousel/owl.carousel.min.js"></script>
</body>
</html>
Looking at your html, it should work. Just add the snippet (that you mentioned first) right after you include owl carousel js file. So, the final should look like:
...
<script src="jquery.min.js"></script>
<script src="owlcarousel/owl.carousel.min.js"></script>
$(document).ready(function(){
$(".owl-carousel").owlCarousel();
});
</body>
</html>
First of all just for starters, Your CSS link is set wrong, remove the hyperlink tag as link is its own tag... I think I see it, from what I see its the only option... PS You did lack a little on showing us your file locations and code...
$(document).ready(function(){
$(".owl-carousel").owlCarousel();
});
Running it from the Javascript console that inspecting Chrome exposes is the best way to test IMO. Running that script is basically what you're doing when you load it via JQuery, here you're just doing it manually. If the site has a CDN, I say try it with that first, then if it's working you can download it and get it working locally.
This question already has answers here:
Rails javascript only works after reload
(8 answers)
Closed 8 years ago.
I designed a website for a local charity and used a template I found on the internet to add some interest. When the files were all uploaded to the host server, none of the javascript elements will work. If you click on something, I can see in the address bar of my browser that the code is updating but I don't see the update on the web page until I click the refresh button.
I have never worked with Javascript before and I've tried to find an answer on the web in forums but haven't had much luck.
This is the top portion of my index.html page:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>the CR</title>
<meta name="keywords" content="running, walking" />
<meta name="description" content="5k race" />
<link href="cr_style.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.scrollTo-min.js"></script>
<script type="text/javascript" src="js/jquery.localscroll-min.js"></script>
<script type="text/javascript" src="js/init.js"></script>
<link rel="stylesheet" href="css/slimbox2.css" type="text/css" media="screen" />
<script type="text/JavaScript" src="js/slimbox2.js"></script>
</head>
This is part of the main body of text where clicking on an image should move to a different section:
<div id="main">
<div id="content">
<div id="home" class="section">
<div id="home_about" class="box">
<p>custom text here
</div>
<div id="home_gallery" class="box no_mr">
<img src="images/gallery/01.jpg" alt="logo" />
<img src="images/gallery/02.jpg" alt="Event Photo" />
<img src="images/gallery/03.jpg" alt="logo" />
<img src="images/gallery/04.jpg" alt="Event Photo" />
<img src="images/gallery/05.jpg" alt="logo" />
<img src="images/gallery/06.jpg" alt="Event Photo" />
</div>
<div class="box home_box1 color2">
<img src="images/about-01.jpg" alt="About Us" />
</div>
There are two links attached to images where the user is supposed to be taken to either a page about the race or about the sponsors.
When I click on the image, I see 'http://www.website.com/#about' in the address bar but the '#about' details do not load until I click the refresh button.
When I originally began customizing the template with our content, the javascript didn't always work. I would open the html file and save it as something else and it would work.
I'm under a lot of pressure by the charity to get this up and running ASAP. Do any members of this community have any suggestions?
Try this;
<img src="images/about-01.jpg" alt="About Us" />
Just add the filename before the #.
Cant get this code to work in chrome, which is essential since I'm developing for android. Can anyone see the error?
I just want to load 'page1.html' into '#container1'. Should be easy and it was working before. But I have tried rebuilding the code from scratch and I can't see what the error is.
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>TheTutorialBlog.com : jQuery Deep Linking</title>
<link href="css_elIndex.css" rel="stylesheet" type="text/css" />
<script src="jquery-1.7.2.min.js"></script>
<script src="bbq-1.2.js"></script>
<script type="text/javascript">
$("document").ready(function(){
alert('doc ready');
$('#container1').load('page1.html');
});
</script>
</head>
<body>
<div class ="topBar">
<div class = "backButton">Home</div>
</div>
<div id="pageContainer">
<div class="pageViewer" id="container1">
</div>
<div class="pageViewer" id="container2">
</div>
<div class="pageViewer" id="container3">
</div>
</div>
</body>
</html>
Page1.html:
<ul class="tabs">
HEi
</ul>
When accessing files via the local file system (file:// URLs) you cannot load any local AJAX resources in Chrome and Opera for security reasons.
When using HTTP there is the "same origin policy" to prevent sites from accessing data they shouldn't have access to. However, on the local file system there is no way to know what's safe to access and what not. So AJAX requests to local files are generally blocked.