In my Js script i tried escaping,setting string to another complete variable and everything i can think of doing.
But cant figure out why the "/ "character in the background-image:url("../") is giving me such a hard time.
Here is a piece of code from my Js script.
let image = "../../" + value.image;
receptenMarkup += '<div class="receptImage" style="background-image:url("../../'+ value.image +'");" alt="test"></div><img src="'+ image + '">';
"../../'+ value.image +'" comes back correctly in the console.log as the path.
Image comes back as the correct path.
Example:
../../images/recepten/thai-chicken.jpg
My console.log of the entire markup also shows a correct path.
<div class="receptImage" style="background-image:url("../../images/recepten/noodle- soup.jpg");" alt="test">
but!! here is the Result in the inspector..
RESULT INSPECTOR:
<div class="receptImage" style="background-image:url(" ..="" images="" recepten="" noodle-soup.jpg");"="" alt="test"></div><img src="../../images/recepten/noodle-soup.jpg">
Notice the image url works great and fine!
The CSS part on the other hand gets all sorts of crazy.
I cant get this to work properly and point the background image to the right path.
I collect a lot of Json data and make cards based on that.
the background image needs to be in a div so i can style it in RWD and not deform like an image tag does.
Somehow i cant get this to work.
Can anyone please give me pointers?
I tried
1: using ../../ to escape ../../ to escape
2: using just "/'value.image'" to go to the root of the website as W3 suggests, no go.
I bee at this for hours now and my deadline is approaching..
Please can anyone explain why the / becomes a space and i get stuff like image=.. in there which i didnt even type that wat.
URL and IMG react differently.
The problem isn't the /, it's the mismatched quote characters delimiting the strings and attribute values.
The simple fix for this is to use a template literal:
receptenMarkup += `<div class="receptImage" style="background-image: url('../../${value.image}');" alt="test"></div><img src="${image}">`;
Side note; I would suggest making all paths relative to the site root, not relative to the current page.
Related
I am editing a javascript file for the first time and was wondering if someone could help point me in the right direction.
h&&""!=g&&(k+='<strong>Get Directions:</strong> '+g+"<br>"),
The code above is just a snippet from a larger file but is what I am trying to edit. I have added 'Get Directions' but now I want to remove the URL being shown in the middle of the link so that it reads "Click Here".
The +g+ is outputting an office URL.
I am unsure of how to edit the line as everything I do breaks the module.
E.g. example that does not work....
h&&""!=g&&(k+='<strong>Get Directions:</strong> 'Click Here"<br>"),
It's confusing because you are using ' and " on the same line to enclose strings. The "Click Here" text should be inside the string like this:
Click Here<br>')
Does this work?
h&&""!=g&&(k+='<strong>Get Directions:</strong> Click here<br>'),
I currently have a PHP preg_match and cURL script that gets the content of a specific line and displays it.
http://cdadownloader.cf is the link. If you will paste in the form e.g 5640653 it will scrape the content of http://www.cda.pl/video/5640653, then the preg_match
preg_match_all("~^\s*file\s*:\s*'(.*?)',?\s*$~m", $source_code, $file);
will look inside the script tags for a line called " file "
file: 'http://vgra012.cda.pl/13495603584734.flv?st=s5O2O-YWjbPgOLS3GLGHGg&e=1453683496',
and will get is contents in this case
http://vgra009.cda.pl/13495603584734.flv?st=Vu78-g3noIN23uy_9-mKZQ&e=1453683460
by using
substr($file[0][0], 23,-2)
the URL is displayed and used.
Everything works fine ( download buttons does not work as i still have a problem with headers so only works with right click to save )
now they have added a premium player that uses a variable to store the url and i have no idea how to get its contents
$f().setClip('http://vrbx098.cda.pl/vl73f1740f66221a2168a374b86409140d.mp4?st=D-wuSToxZfD4e4UGaXw4qg&e=1453679326');
Would someone be able to point me in the right direction without unnecessary comments ? :) Thanks in Advance
Okay, I think I understand what you are wanting. Here is something for you to try:
preg_match("~setClip\('(.*?)'~", $page_contents, $setclip_match);
$setclip_url = $setclip_match[1];
I understand that there are similar questions out there, but none of them seem to work properly for me. I have a slider and an image. When I change the value of the slider, I want the image to change as well. Here are the relevant pieces of javascript:
var imageArray = ['face0.png',
'face1.png',
'face1.png',
'face2.png',
'face2.png',
'face3.png',
'face3.png',
'face4.png',
'face4.png',
'face5.png',
'face5.png'];
function sliderValueChange(value) {
//$('#painScaleImage').attr('src', '~/Content/' + imageArray[value]); ***gets wrong path
//$('#painScaleImage').src('~/Content/' + imageArray[value]); ***jQuery has no method called .src()
//document.getElementById('painScaleImage').src = '~/Content/' + imageArray[value]; ***gets wrong path
//these are commented out because they all failed to work
}
My images are located in my project under Content/face0.png, Content/face1.png, etc. My Views are located in Views/Home/view.cshtml. The problem is that when I called the $(...).attr() and document.getElementById(...).src functions, the browser looked for the images under /Home/~/Content/face0.png instead of looking under Content/face0.png. The reason I assumed I could use ~/Content/face0.png is because if I were to declare the images in html, this would get the image in the right place <img src="~/Content/face0.png" />. How can I properly achieve what I am trying to do? What is going wrong?
Got it, root relative paths were the correct answer for my solution.
(start the path with a /).
I currently use this little line of code to "post" messages.
setTimeout(function(){
o.html(o.html() + "Username:<br>" + msg[r] + "<br><hr>")
}, 7000);
It works great, it posts messages from an array, ads some styling.
But right now when it posts a message it looks like:
Username:
messagehere
<hr>
What I want is the code to post an image as well, before the message and username. Like as you would see on facebook when chatting with someone, commenting something etc.
I tried just putting a +<img src="" class=""/> in front of it but that did nothing. The whole code suddenly stopped working.
So right now I am looking for the correct way of doing this, id like to add an class to it, so I can style the whole thing correctly with css (having the avatar in front of the message and username, like explained earlier)
If someone could help me find the correct way, that'd be much appreciated.
You just need to wrap the img tag in quotes. It's erroring because without the quotes, your browser thinks it's a variable or function instead of a string literal.
+ '<img src="" class=""/>'
Also, you should use the .append() function instead of doing .html(.html() + ...)
o.append("Username:<br>" + msg[r] + "<br><hr>" + "<img src='' class='' />");
I imagine this has been asked many times but I am having problems with the above error,
What I am trying to do is have a cortina effect menu whose child divs content will change depending on a variable which is coming from a drop down menu.
So I wrote roughly how the content of the div would look for one option in a bid to test it out and this is what I have:
function popupContent(selectedText)
{
return '<div>Operating System:
<a class="changer">+<\/a><select class="firstSelect">
<option>Windows<\/option>
<option>OSX<\/option>
<option>Linux<\/option>
<\/select>
<\/div>
<div>Releases:<a class="changer">+<\/a><select class="secondSelect"><option>11.0<\/option><option>11.2<\/option>
<option>10.1<\/option>
<\/select>
<\/div>';
}
I set the content of the div using $('#divname').html(popupContent(this.name));
When I try to load the page I get a unterminated string literal error, I have spent some time looking around and most of the questions seem to be when the word script is in it (which I don't have) and escaping / characters which I have tried as you can see.
Can anyone shed some light on this please?
Your string has line breaks in it.
You can do this instead:
return '<div>Operating System:' +
'<a class="changer">+<\/a><select class="firstSelect">' +
'<option>Windows<\/option>' +
etc.