I have a problem with lightbox. After clicking the image file it just redirects me to the image.
This is the code in the cshtml.
<a href="" data-lightbox="screenshot" >
<img src="" />
</a>
The href and src's values are automatically being inserted by a jquery code and is guaranteed to be the same image. The styles and scripts that are necessary are also inserted.
<script src="../../Scripts/jquery-1.11.0.min.js" ></script>
<script src="../../Scripts/lightbox.min.js" type="text/javascript"></script>
<link href="../../Styles/lightbox.css" rel="stylesheet" type="text/css" />
How do I view the image using lightbox instead of it redirecting? I followed the instructions in this link but it still did not work: http://lokeshdhakar.com/projects/lightbox2/
Put the
<script src="../../Scripts/lightbox.min.js" type="text/javascript"></script>
line at the end, before the closing /body
Related
I am trying to make web application and i need to add an icon to my title bar with a name.
I am making the web application using empty project in MVC with web form included. I am doing the coding using Visual studio 2017. I have tried my layout as below so far.
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<link href="~/Content/nav.css" rel="stylesheet" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="icon" type="image/svg" href="~/Content/img/download.png" />
<script src="~/Scripts/layout.js"></script>
<title>#ViewBag.Title</title>
</head>
<body>
<navbar>
<div class="topnav" id="myTopnav">
Home
Login
Payment
Customer Registration
<a href="javascript:void(0);" class="icon" onclick="myfunction()">
<i class="fa fa-bars"></i>
</a>
</div>
<div>
#RenderBody()
</div>
</navbar>
</body>
</html>
I have tried to link the image before title but it took a wrong turn. Since I am new to MVC, please give me some method to add an icon to title bar.
What you are looking for is called a favicon. You can generate it from png or whatever and then include it in your page like this:
<link rel="icon" href="/favicon.ico" type="image/x-icon">
Here's a favicon generator (one of many):
https://www.favicon-generator.org/
The problem lays in this code:
<link rel="icon" type="image/svg" href="~/Content/img/download.png" />
You are specifying that the type is image/svg while instead it is a image/png.
Be sure that a png image exists in Content/img folder.
I used easy java simulation to create a simulation and export it into an HTML file with some reference js and CSS file
How do I edit it to make an ionic app
<ion-content>
<head>
<link rel="stylesheet" type="text/css" href="assets/css/ejss.css" />
<script src="assets/js/common_script.js"></script>
<script src="assets/js/textresizedetector.js"></script>
<script src="assets/js/ejsS.v1.min.js"></script>
</head>
<body>
<div role="button" id="_topFrame" style="text-align:center"></div>
<script src="assets/js/Test.js"></script>
</body>
</ion-content>
Use these code on the home page but running it does not display anything
I am using the Infragistics Ignite UI grid in MVC. I was able to load my grid properly but it is not displaying in the browser. When I click view source on the browser I can see that the grid has loaded the data but it isn't displaying anything but a " . I really don't understand how it is not displaying the css is there. Is it because of the bootstrap.css that could cause this.
#IMports Infragistics.Web.Mvc
#ModelType System.Collections.ObjectModel.ObservableCollection(Of FultonWS.scll_label)
#Code
ViewData("Title") = "Tickets"
End Code
#Html.Infragistics.Loader().ScriptPath("~/js/").CssPath("~/css/").Render()
#Html.Infragistics.Grid(Of Mueller_Scale_System_Dashboard.FultonWS.scll_label)(Model.AsQueryable()).ID("igGrid").Columns(Sub(col)
col.For(Function(i) i.scll_part).HeaderText("Part Number")
End Sub).Features(Sub(features)
features.Paging().PageSize(20)
features.Sorting()
features.GroupBy()
features.Updating().EnableAddRow(False).EnableDeleteRow(False)
End Sub).DataBind.Render()
I render scripts and css in the layouts page
<link type="text/css" href="~/css/themes/infragistics/infragistics.theme.css" rel="stylesheet" />
<link type="text/css" href="~/css/structure/infragistics.css" rel="stylesheet" />
<title>#ViewBag.Title - Mueller Scale System Dashboard</title>
#Styles.Render("~/Content/css")
#Scripts.Render("~/bundles/jquery")
#Scripts.Render("~/bundles/modernizr")
<script src="~/Scripts/jquery-ui-1.8.11.js" type="text/javascript"></script>"
<script src="#Url.Content("~/js/infragistics.loader.js")" type="text/javascript"></script>
and my controller action is below
Async Function Tickets() As Threading.Tasks.Task(Of ActionResult)
Dim bd As New BusinessData
Dim ticketsColl = Await bd.GetTicketsAsync
Return View("Tickets", ticketsColl)
End Function
The issue is that JQuery in MVC 5 loads the script in the body of the html.
This was stopping the control from loading properly because the scripts wasn't available at the time of load. comment out the render script for jquery and add it to the head section of the html.
<div class="container-fluid body-content">
#RenderBody()
<hr />
<footer>
<p>© #DateTime.Now.Year - </p>
</footer>
</div>
#*#Scripts.Render("~/bundles/jquery")*#
#Scripts.Render("~/bundles/bootstrap")
#RenderSection("scripts", required:=False)
Struts jquery anchor tag is not showing in the form
<head>
<sj:head jqueryui="true" jquerytheme="redmond" />
<!--
<link rel="stylesheet" href="css/jquery-ui.css"> -->
<script type="text/javascript" src="js/jquery-1.10.2.js"></script>
<script type="text/javascript" src="js/jquery-ui.js"></script>
</head>
<s:form id="form">
........................
..........................
<s:url var="ajaxReport" value="/report.action"/>
<sj:a id="sumbit" formIds="form" buttonText="Sumbit" indicator="indicator"
button="true" buttonIcon="ui-icon-refresh" > Submit</sj:a>
</s:form>
In this only the submit text is displayed. Any idea what might be wrong here?
The <sj:head /> tag already includes the jQuery libraries. Including them again usually causes problems, and the JS console may provide a clue.
I've been trying to make a jQuery tab UI like in the following Better alternative to an iframe? but after hours of troubleshooting I just don't know what I'm doing wrong.
My test.html:
<html>
<head>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/ui-lightness/jquery-ui.css" type="text/css" media="all" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.min.js"></script>
<script type="text/javascript">
$(function() {
$("#tabs").tabs();
});
</script>
</head>
<body>
<div id="tabs">
<ul>
<li><span>One</span></li>
<li><span>Two</span></li>
<li><span>Three</span></li>
</ul>
</div>
</body>
So in my folder I have test.html (the above), one.html, two.html, and three.html. When I load test.html, any tab I select just says Loading... and the html pages never load.
For a more visual explanation, I'm trying to do what this demo is but with html pages:
http://www.coldfusionjedi.com/demos/jquerytabs/test.cfm
Please help haha I'm so lost as to what I'm doing wrong. Thanks in advance :)