Recommended Javascript Image preloader
Question by Daniel Ribeiro
There are a couple of tools and several tutorials (even some including links to github) on how to preloading images and other artifacts, like css and scripts. YUI3 preloader seems to be the most reliable one.
Is there a better one? Are there any others that are faster (possibly through parallel loading), more usable or has better browser compatibility? Maybe one that uses jquery instead of YUI…
Answer by Starx
Give paragraph effect through Css
Question by Starx
Can you tell me how to give paragraph effect to my paragraph using css?
for example:
This is my paragraph. This is my paragraph. This is my paragraph.
This is my paragraph. This is my paragraph. This is my paragraph. This is my paragraph.
This is my paragraph. This is my paragraph. This is my paragraph. This is my paragraph.
This is my paragraph. This is my paragraph. This is my paragraph. This is my paragraph.
This is my paragraph. This is my paragraph. This is my paragraph. This is my paragraph. This is my paragraph. This is my paragraph. This is my paragraph. This is my paragraph.
This is my paragraph. This is my paragraph. This is my paragraph. This is my paragraph.
This is my paragraph. This is my paragraph. This is my paragraph.
See the padding in the first line. I wantthat
Answer by Yi Jiang
You can try the text-indent
property.
p { text-indent: 1em; }
Answer by Starx
How to STOP a JavaScript function when a certain condition is met
Question by Rhys
I can’t find a recommended way to STOP a function part way thru when a given condition is met. Something like Exit, or Break?
I am currently using this?
If x >=10 {Return;}
other conditions;
Answer by g.d.d.c
Return is how you exit out of a function body. You are using the correct approach.
I suppose, depending on how your application is structured, you could also use throw. That would typically require that your calls to your function are wrapped in a try / catch block.
Answer by Starx
use return
for this
if(i==1) {
return; //stop the execution of function
}
else {
//keep on going
}
CSS Selector for Absence of Tag
Question by Ethan Turkeltaub
Given this HTML:
<div class="entry">
<a class="meta">Aug. 20, 2010</a>
<div class="content">
<h2><a href="#">Hello.</a></h2>
<p>...</p>
</div>
</div>
<div class="entry">
<a class="meta">Aug. 20, 2010</a>
<div class="content">
<p>...</p>
</div>
</div>
And this CSS:
.entry{
width: 760px;
}
.entry .meta{
float: left
width: 160px;
}
.entry .content{
float: right;
width: 600px;
}
Is there a selector to add a margin-top: 25px;
to .entry .meta
in the absence of the <h2>
tag? Or will I need to resort to JavaScript for this?
Parent child combo box
Question by user395702
Hi
I want to implement child parent combo box(country state like if we select any country the state combo box should be populated according to selected country) in my form with jquery.
Please give any suggestion how to implement this
Thanks
Answer by Starx
Well, attach a function on the change event of the country combo box and fetch the html from the AJAX or similar. Then populate the child combo box.
For example
$("#parentbox").change(function() {
var myval =$("#parentbox").val();
// Fetch the content from database or similar
$("#childbox").html(newhtml);
}
JavaScript gets rid of trailing slash in <img /> tag
Question by ashurexm
I have the following JS code:
validateConfigName.html('<img src="/rta/images/check-24.png" />');
But when it executes in Firefox I see this as the generated code:
<img src="/rta/images/check-24.png">
Why?
Answer by Nick Craver
In HTML the <img>
tag is supposed to be <img>
, in XHTML it’ll be <img />
…so depending on what DOCTYPE your page is using, this will vary.
From the HTML 4.0 Spec for <img>
:
Start tag: required, End tag: forbidden
In XHTML elements must be closed:
Well-formedness is a new concept introduced by [XML]. Essentially this means that all elements must either have closing tags or be written in a special form (as described below), and that all the elements must nest properly.
Answer by Starx
It’s the way, the browser renders your html code according to the doctype used.
Nothing to worry about though..
resize DIV matching the new content with jquery
Question by Sandro Antonucci
I have a DIV which shows one image at once coming from an ajax script, the images are all different in height and are showed with fadeIn/fadeOut (just for the tag)
How can I allow to resize the DIV (that contains the img tag of course) “sliding” based on the new content before the images that fadein changes the DIV height very rudely? 😛
Thanks
Answer by Starx
Well do Something like this
$(".change").click(function() {
$(".mydiv").fadeOut('slow');
$(".myimg").attr("src",'');
$(".myimg").attr("src","linktonewimage.jpg");
var newheight = $(".myimg").height();
$(".mydiv").css("height",newheight+"px");
$(".mydiv").fadeIn('slow');
});
I am assuming you have a <img>
tag with myimg
class inside a div
with mydiv
class.
Check the DEMO HERE
Continuing to hide HTML input fields when page refreshes?
Question by John M
On a HTML page there is a filter section consistenting of various drop-downs and textboxes. When the ‘type_of_report’ drop-down is selected the ‘onchange’ event will hide all the non-relevant inputs for that ‘type_of_report’. The filter criteria is preserved via GET (which I retrieve via PHP $_GET).
The problem is that when I submit the form (run the report) the ‘hidden’ fields re-appear when the page refreshes.
How do I keep the non-relevant input fields hidden when the page refreshes?
NOTE: I am using jQuery (1.4.2) to hide the fields.
UPDATE1:
Final abbreviated solution (based on feedback) looks like this:
<?php
$report_type = $_GET['report_type'];
?>
<html>
<head>
<!-- hiding/unhiding based on report type -->
<script type="text/javascript" src="hide.js"></script>
</head>
<body onLoad="hideall('<?php echo"$report_type"; ?>');">
...rest of code
Answer by Starx
Setup a session variables to keep the status of the drop down boxes. And while you are loading it in the view port… filter them using the session variable. It should solve your problem.
can we pass $_POST value by clicking link?
Question by Giffary
I need to build some php API to upload an image cross subdomain.
Example, upload script located at http://sub.domain.com/upload.php
and I neew to upload an image to http://www.domain.com/media/
I read some content at http://www.v-nessa.net/2009/02/09/simple-api-writing-part-i and i suspect that can we pass $_POST value by clicking link? How?
Answer by Starx
Yes, you can do that… by submitting a form while clicking that link
<a href="#" onclick="document.myformname.submit();">Submit</a>