I am trying to accomplish something like this :
<?php $url = 'http://www.mydomain.com/img/picture.jpg'; ?>
<img src='<?php echo $url ?>' />
Only the problem is I want to accomplish this using javascript. Something like this
<script>url = 'http://www.mydomain.com/img/picture.jpg'</script>
<img src='<script>document.write(url)</script>' />
Of course it wouldn't work, but you got the idea. Any thought ?
Try - http://jsfiddle.net/m2Prh/
<img id="image" />
<script>
var url = 'http://lorempixel.com/300/200';
document.getElementById("image").src = url;
</script>
I suggest reading jquery ,you can acesss every html element
Related
I have a block of html with a lot of <img src="..."/> inside of it.
Now I'm looking for a way to make this:
<img src="lol.jpg"/> into:
<a href="lol.jpg" class="image_inside_text" target="_blank">
<img src="lol.jpg"/>
</a>
The idea is to make images open in a new page to view the full size image, and I'm adding a class in case I want to make it into a popup later on.
I'm looking to do this in PHP, can someone please help me?
Thank you
He asked for solution in PHP (see tags).
$string = <<<EOD
<img src="lol.jpg">
<img src="lol.jpg"/>
<img src="lol.jpg" alt="sufix"/>
<img alt="prefix" src="lol.jpg"/>
EOD;
$pattern = '/<img[^>]+src="([a-z.]+)"[^>]*>/i';
$replacement = '${0}';
echo preg_replace($pattern, $replacement, $string);
Online version: http://ideone.com/pY2EWY
Well, just use some jquery, try this :
<script>
$(function(){
$('.thisimg').replace('<img src="your src" class="thisimg" />');
});
</script>
<img src="your src" class="thisimg" />
There are several ways of doing so... Most involving Javascript.
Take a look at jquery's method wrap(), that wraps any selected element into another element:
$("img").each(function() {
var href = $(this).attr("href");
$(this).wrap("<a href='"+href+"' class='image_inside_text' target='_blank'></a>");
});
http://api.jquery.com/wrap/
You can use jQuery:
$(function(){
$('img').each(function() {
var src = $(this).attr("src");
$( this ).replaceWith('<img src="' + src + '"/>')
});
});
You can use output buffering: ob_start and do something similar to this example and replacing the callback with what test30 suggested:
<?php
function callback($buffer)
{
// replace all the apples with oranges
return (str_replace("apples", "oranges", $buffer));
}
ob_start("callback");
?>
<html>
<body>
<p>It's like comparing apples to oranges.</p>
</body>
</html>
<?php
ob_end_flush();
?>
i want to have an iframe, which displays the page given as parameter in the url.
I'm using ASP.NET MVC4
so I wanna do something like this:
updated it... but still not right i think
<?php
if(!isset($_GET['link']){
$link = $_GET['link'];}
?>
<iframe name="inlineframe" src="<?php $link ?>" frameborder="0" scrolling="auto" width="500" height="180" marginwidth="5" marginheight="5" ></iframe>
but i can't figure out the right code for this. can anyone help?
I also tried echoing php, but that doesnt seem to work for me.
The problem with your code snippet is this:
src="<?php $link ?>"
You're calling the variable, but doing nothing with it
To write the variable in the src attribute, use echo:
src="<?php echo $link ?>"
You should also remove the ! in your if statement
Try this:
<?php
$link = '';
if(isset($_GET['link']){
$link = $_GET['link'];
}
?>
Also echo your link variable.
src="<?php echo $link; ?>"
I've got a HTML file which I've created and is stored in a directory elsewhere.
The problem is, I'd like to be able to get content externally and place it within the HTML file.
I figured I could use PHP for this, because it's server-side and can access the files I want.
So, I created a PHP script which opens and echoes a HTML file, and afterwards, echos some JavaScript to change elements that are on the screen.
Here's my PHP file:
<?php
$html = file_get_contents('file.html');
$imageurl = file_get_contents('url.txt');
$js = '<script type=\'text/javascript\'>updateImage(\'img1\', '.$imageurl.');</script>';
echo $html;
echo $js;
?>
..and the HTML file:
<html>
<script type="text/javascript">
function updateImage(id, url) {
var img = document.getElementsByName(id)[0];
img.src = url;
}
</script>
<body>
<img src="" name="img1" />
</body>
</html>
It's not the best method, but it works.
I would like to know a way to do this within PHP, not using JavaScript.
I'm not sure as of the best approach to this.
You could use include and ob_get_contents to get the html as string and do some str_replace or preg_replace on that.
Your HTML:
<html>
<body>
<img src="{IMAGE_SRC}" width="512" height="512" name="image" />
</body>
</html>
Your PHP:
ob_start();
include 'your_file.html';
$buffer = ob_get_contents();
ob_end_clean();
$buffer = str_replace('{IMAGE_SRC}', 'your_image.png', $buffer);
print $buffer;
That is a pretty basic question. You should read some PHP and HTML Tutorials. Something like this will do the trick:
<html>
<body>
<img src="" width="512" height="512" name="<?= $somePhpVariableContainingTheName ?>" />
</body>
</html>
PHP code (functions.php)
$main = $db_sql->query_array("SELECT catid,titel,subcat,startorder FROM $cat_table WHERE catid='$subcat'");
$tpl->register('category_title',stripslashes($main['titel']));
$tpl->register('category_id',$main['catid']);
So I want to add an if statement where if {category_id} is not 0 then do the following code
<img src="{GRAFURL}/{category_id}.jpg" alt="{category_title}" width="50" height="50" border="0" align="middle" /> {category_title}
what would be the correct syntax?
need more code still for the html file?
HTML doesn't have dynamic features like if-statements. Think of HTML as a language to define a layout - unchangeable using HTML itself.
This should do the trick:
<?php
if ( false === is_empty( $category_id )) {
echo "<img src='{$GRAFURL}/{$category_id}.jpg' alt='{$category_title}'
width='50' height='50'
border='0' align='middle' /> {$category_title} ";
}
?>
In case you need to add client-side dynamic features to your HTML-pages, have a look at jQuery or jQuery UI.
HTML has no such capability. You would need to generate your HTML using a programming language. Then the syntax would depend on which language you were using.
e.g. in TT:
[% IF category_id %]
<img src="[% GRAFURL %]/[% category_id %].jpg"
alt="{category_title}" width="50"
height="50" border="0" align="middle"
/> [% category_title %]
[% END %]
Use javascript for generating it client side, PHP for server side. Javascript can change things on the page and provide dynamic content after the page is sent to the client; PHP can determine the content before sending it to the user (while it can edit it afterwords, it is much more convoluted).
For example, if you wanted to add it to a tag with id "dynamic", you could use this:
<html>
<head>
<script type="text/javascript">
window.onload = function() {
var img_tag = document.createElement('img');
img_tag.src = "{GRAFURL}/{category_id}.jpg";
img_tag.alt = "{category_title}";
img_tag.width = 50;
img_tag.height = 50;
img_tag.border = 0;
img_tag.align = "middle";
document.getElementById("dynamic").appendChild(img_tag);
};
</script>
</head>
<body>
<div id="dynamic">
</div>
<body>
</html>
I thoroughly recommend learning jQuery, however, where you could do things easier and faster. Also, it is up to you to replace the values in braces with the correct values (either through PHP or javascript), I couldn't tell what you were doing.
I have the following code (I formated it to more lines, but in my source code I have it in one line, because innerHTML doesn't like new lines somehow - but that isn't the problem...):
<?php
echo "
<img
src='1.png'
onclick='
document.getElementById(\"my_div\").innerHTML=\"
<img src=\\\"1.png\\\" onclick=\\\"alert(\\\\\\\"text\\\\\\\");\\\" />
\";
'
/>
";
?>
And somewhere in the body I have :
<div id="my_div"></div>
So, when I click on the image, i'll have the same image inside my_div. The problem is, that when I click on the 2nd image, javascript doesn't alert anything.
But when I change this:
alert(\\\\\\\"text\\\\\\\");
to this:
alert(MyText);
and add JavaScript variable MyText:
<script>
MyText = "text";
</script>
it now works.
I think the problem is with those nested quotes:
\\\\\\\"
(level 4). Any ideas? Thanks.
EDIT: please don't post here another methods of doing this, I'd like to know why those quotes doesn't work here..
SECOND EDIT: I need that php there, because this is only a piece of my code (in full code I need it to display images in cycle...)
If you want a quote character as data (instead of as an attribute delimiter) in HTML, you represent it as " not \"
There's nothing "dynamic" in your script - you're not inserting PHP variables, so why build that all from within a PHP echo? Simply have:
Or if you want to make it even cleaner:
<script type="text/javascript">
function addImg() {
document.getElementById('my_div').innerHTML='<img src="1.png" onclick="alert(\'text\')" />';
}
</script>
<img src="1.png" onclick="addImg()" />
refactor your JS into an external file (with a function that will do the onclick logic), and try outputting something simpler with php's echo
Use jQuery!
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.2.min.js"></script>
<div id="my_div"></div>
<img src="1.png" class="my_img" />
<img src="2.png" class="my_img" />
<img src="3.png" class="my_img" />
<script type="text/javascript">
jQuery(function() {
$('.my_img').click(function() {
$('#my_div').html($(this).clone().unbind());
alert('text');
});
});
</script>