HTML img - passing file name as parameter - html

I would like a HTML to get an image file name as a parameter from another page and display that image. I only know a bit of HTML. I don't know PHP etc.
I have a website which has several HTML pages. I want to write an "image container" page which will be called from other pages. The other pages will pass it a bitmap file name and the container page will display that image.
Ideally the container page should be getting few other parameter like the width and height of the image.
In showimage.html:
Instead of this:
<img src="bitmaps/test.jpg" height="200">
Have something like this:
<img src="{parameter 1}" height="{parameter 2}">
And the calling page will call showimage.html with "bitmaps/test.jpg" and "200".

Related

How to share anchor links with angular components on angular 14?

I have a component menu which contains a few anchor tags. Each tag brings the user to that respective page section. I am trying to share the same anchor tag among the other components.
For example, I have two more HTML components called homepage.component.html and details.component.html. For each I call the menu.component.html by its selector. Both homepage and details html components have an id for the section I wanna scroll to. Here's how it looks like:
menu.component.html
Go to content
for both homepage.component.html and details.component.html
<div class="home-content" id="content"> Here comes more code </div>
It should work just like in a non-dynamic html project, however, when the anchor tag is clicked, the url redirects to '' (which is the first/default page) and then it shows the content for the first page, instead of the current componenet I am on.
I have tried creating a function where I get the current url and using the router.navigate, I pass the parameters indicating the fragment:
menu.component.ts
currentRoute: string
scrollToItem(){
this.currentRoute = this.router.url
this.router.navigate([this.currentRoute], {fragment: 'content'})
}
menu.component.html
<a (click)="scrollToItem()">Go to content</a>
However, this function adds the id #content to the url each time the anchor tag is clicked, redirecting the user to my 404 page.
I wanted to know if there is a way to use an anchor tag on the menu.componenet.html, while all the items that have "content" as their ids in different components are going to be displayed. Hopefully I made my question clear. If there is still questions about how the error occurs I can create and shate a stackblitz project. Thanks in advance :)

Best way to send photo inside mail Django

What is the best way to attach my website logo inside activation mail? I tried to do something like this:
#lru_cache()
def logo_data():
with open('templates/authentication/logo.png', 'rb') as f:
logo_data = f.read()
logo = MIMEImage(logo_data)
logo.add_header('Content-ID', '<logo>')
return logo
and then:
email=EmailMessage(subject=email_subject, body=email_body, from_email=settings.EMAIL_FROM_USER, to=[user.email])
email.attach(logo_data())
email.content_subtype='html'
email.send()
In my html file it looks like this:
<img src="cid:logo" style="width: 242px; height: 88px;"/>
but it doesn't work. The photo is actually added to the mail in attachments, but the <img> tag is empty and looks just like this:
What is wrong? I read also that attaching photos to email is not recommended because mail gets cause of that extra spam points. What is the best way to do this? Can I send my png logo without attaching it into attachments?
EDIT
I tried to add url (to my photo on google drive) like this <img scr="url"> but these properties disappear inside mail
You can use a CDN, like S3 or Google Cloud bucket to upload the image and add the url of the image in your <img src="URL"> tag.

Vue img src concatenate variable and text

I'm trying to concatenate Vue variable with image URL, but the browser didn't show the picture. Could anyone tell me what's the matter with my coding?
I have tried as follow.
The picture didn't show in the browser.
<img :src="'../assets/'+item.picture">
If I wrote as below, the picture is shown.
<img src="../assets/6cb38c91115bcdf0c824124e4b5ecb71.jpeg">
Thank you very much!

How to use fancybox to show specific class of webpage?

https://jsfiddle.net/054j0fj7/
As you can see when you click on show catlinks you get the wikipedia page, How ever I would like to show the catlinks at the end of page.This area is defined in HTML as following:
<div id="catlinks" class="catlinks" data-mw="interface">
and this is the fancybox
<div> Show Catlink </div>
Just change target URL to correct one with anchor #catlinks.
<div>
Show Catlink
</div>
If you want to display only part of the external page, then it is not possible to implement directly. You would need to create, for example, php file that reads content of that page, parses and outputs only the part you need. Then you would simply display that page in fancybox.

adding imageurl to image element dynamically wont work

so iam trying to add a image i have saved on my project in image folder. But it dosent work
DirectCast(Customer.Items(0).FindControl("imageControl"), Image).ImageUrl = "~/images/IMG_1287.JPG"
DirectCast(Customer.Items(0).FindControl("imageControl"), Image).DataBind()
customer is the repeater html element the image element is in. I cant call the image element direct in the server code because the image element is inside a repeater element. So i have to use findcontrol method which works good. When i debugg the code i can se that it finds the right image element the problem is when i set the imageurl nothing seems to happen in the ui but i dont understand why can anybody help me please :)
<div>
<asp:Image ID="imageControl" Width="100%" Height="70%" runat="server"/>
</div>
To me it looks like you are not trying access controls within repeater in correct manner , it should be like :
If image is in header :
DirectCast(Customer.Controls[0].Controls[0].FindControl("imageControl"), Image).ImageUrl = "~/images/IMG_1287.JPG"
If image is in footer
DirectCast(Customer.Controls[Customer.Controls.Count - 1].Controls[0].FindControl("imageControl"), Image).ImageUrl = "~/images/IMG_1287.JPG"
Please have a look at this post for more details.
PS : Are you using vb ? cause i have used C# syntax, if yes change accordingly.