I am using slider pro for showing product image slides and using azure media player's video tag to show videos on sp-slides-container div. The video is playing fine on sp slider but when I click on it and the lightgallery opens it's neither able to play the video nor show the thumbnail due to different HTML structure than slider pro. The following examples are from the console:
**lightgallery-all.min.js:4 lightGallery :- data-src is not pvovided on slide item 1. Please make sure the selector property is properly configured. More info - http://sachinchoolur.github.io/lightGallery/demos/html-markup.html**
<div data-vimeo-id class="lg-thumb-item active">
<img src(unknown)>
</div>
And on the preview div:
<div class="lg-img-wrap">
<img class="lg-object lg-image" src="undefined">
</div>
Here the img src is undefined because I am using video tag, not img tag in my dynamic html code. It's using data-vimeo-id and img tag but I need to append the tag there dynamically (which I added in C# controller code with dynamic source and poster url) instead of the default img tag.
How can I define the video tag inside lightgallery dynamically? Is there any better way to do this? Please note that I have no other option except azure media player for showing the videos on the webpage. The images are working fine in the lightgallery because img tags are defined properly but this issue is only happening with video tags.
Related
I like to use some kind of glyphicons in my page,But it is not showing,But when
tried the below ,(attached images of View with and without this reference )
in my page the whole page changes,i have the bootstrap.min.css page file,and am also tried calling this file,But still it is not working ,Any solution?
Code
<span class="glyphicon glyphicon-unchecked" style="color:#s.mcolor"></span>
im doing a project using .net MVC web Application.
i recently used a code to create a new thumbnail to photos (re defining the sizes of a photo) . and now i'm trying to print the photos using the 'img' tag of HTML but without success.
the thumbnail creating code :
Image thumbnail = Image.FromFile(destPath);
thumbnail = (Image)(new Bitmap(thumbnail, new Size(this.m_thumbnailSize, this.m_thumbnailSize)));
thumbnail.Save(destPathThumb);
now for the img printing :
#Html.DisplayFor(modelitem=>item)
<img class="img-rounded" style="border-radius:50%" src=#item alt="">
item is the path to the picture and it is currect (ive checked serveral times).
any ideas what i could be ?
thank you for helping me ! :)
EDIT: the img tag prints normal pictures -> pictures that my program did not create(as i said,my program created thumbnail pictures)
I wonder if it is not releasing the file lock on the image, I have had that problem in the past. You have to be very careful about releasing those Image and Bitmap objects.
Something like this might work, as it will dispose the image before the page starts using it:
using(Image thumbnailoriginal = Image.FromFile(destPath)){
using(Image thumbnail = (Image)(new Bitmap(thumbnailoriginal, new Size(this.m_thumbnailSize, this.m_thumbnailSize)))){
thumbnail.Save(destPathThumb);
}
}
It seems like a lot of brackets on the end but thats ok.
If it still does not work, can you post the html that is sent to the browser, you can do that using "View page source" from the right-click menu in Chrome.
Now we have the html that is going to the browser, we can see that the src attribute is pulling directly from the C drive, rather than from a web url:
<img class="img-rounded" style="border-radius:50%" alt="" src="C:\Users\Operu\Desktop\dest\Thumbnails\2018\6\Sasuke.png">
Normally we would want to see something more like this:
<img class="img-rounded" style="border-radius:50%" alt="" src="\Thumbnails\Sasuke.png">
Could you post the model and controller files next please, so we can see what type of object the #item is when it hits your view. Then we can hopefully get it to pull the relative url address instead of the file location.
I'm try to get the video src link from site. However webbrowser.documenttext only retrieved source code of the website, which does not included the change made to a video tag after javascript render.
For example:
When you get a document text or just a simple webclient request you get the following text for their video tag Screenshot from View-Source
As you see, it has a
<video id="my_play" class="video-js vjs-theme-colors-blue vjs-paused vjs-fluid" controls preload="auto" data-setup='{"techOrder": ["html5", "flash"]}'>
<p class="vjs-no-js">To view this video please enable JavaScript, and consider upgrading to a web browser that supports HTML5 video</p>
</video>
However if you do developer tools, which (I believe) is render by javascript, the video tag is changed to have the src attribute.
Screenshot from Dev Tool
That highlight src attribute in second screenshot is the address I need to get. Any suggestion on how to retrieved that link?
You can use Gecko browser to load the site.
Once the site done loading(Use DocumentCompleted event), you can execute the code below to retrieve the src attribute
GeckoHtmlElement ele;
ele = geckoWebBrowser1.Document.GetHtmlElementById("myData");
MessageBox.Show(ele.GetAttribute("Value"));
Below is my html image control:
<img alt="" src="C:\Users\hkalidindi\Desktop\Feedback.jpg" style="height: 19px; width: 20px"/>
But after debugging it is not showing me any image:
I am new to dotnet..please help me to solve this issue...I know how to display image in image control but i am bit confused about the html image control...
Use image only from the content of your website. So copy the image in your website folder say Images and access your image as <img alt="" src="..\images\Feedback.jpg" style="height: 19px; width: 20px"/>. Or you could use Asp.NET Image control and set image path in Server code using
myImage.ImageUrl=Server.MapPath("Images\Feedback.jpg");
"C:\Users\hkalidindi\Desktop\"
Is only local, try uploading it to a website such as http://imageshack.us, http://tinypic.com, grab the direct link and put that in the source.
<img src="URL">
Here URL = The url of the image.
Possible values (for src):
An absolute URL - points to another web site (like src="http://www.example.com/image.gif")
A relative URL - points to a file within a web site (like src="image.gif")
Refer: HTML src Attribute
You are trying to call the image in your local folder. Add the image to the 'Images' folder in your solution and link to that.
Make sure the image is being referenced from a folder that is in your websites application/dir. Then you can reference it simply by using a tag like so:
<asp:Image id="imgFeedback" runat="server" ImageUrl="~/_common/img/feedback.jpg" />
Or set the image path on the server side:
this.imgFeedback.ImageUrl = Server.MapPath("\_common\img\feedback.jpg\");
I have a html page to share a html 5 video and I want to create a share button.
So far I have this one...
<a name="fb_share" share_url = " #Url.Action("Details", "Player", new { area = "Multimedia", id = item.Id }, "http")" ></a>
...that generates the url http://host/Multimedia/Composer/Player/Details/{Id}
and it works like you can see in this picture.
And I was using this facebook library:
<script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share"
type="text/javascript">
I was wondering what's the easy way to show the page or a preview of the video?
The same link with a YouTube anchor shows something like this:
I got it from this page:
https://developers.facebook.com/docs/share/
And I saw there's some metatags but for .fla or .swf videos and mine is html5. I wonder if there's a similar way to pass the metadata to show it like the second link.