Web Development Questions That Don't Need Their Own Thread v2
3,079 replies, posted
maybe a little stupid, but on a nearly blank page with only some text, it looks like there are linebreaks above the text
the line breaks go away if I remove <!DOCTYPE html>
(the entire code is <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> in the head and some text in <h1> tags in the body>
I tried removing the part in the head too, but it doesn't seem to do anything
am I doing something wrong? IE also seems to do it
[QUOTE=BrQ;33400316]maybe a little stupid, but on a nearly blank page with only some text, it looks like there are linebreaks above the text
the line breaks go away if I remove <!DOCTYPE html>
(the entire code is <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> in the head and some text in <h1> tags in the body>
I tried removing the part in the head too, but it doesn't seem to do anything
am I doing something wrong? IE also seems to do it[/QUOTE]
Maybe be part of the auto-styling by browsers.
In the header section trying adding this:
[code]
<style type="text/css">
body, h1, h2, h3 {
margin:0;
padding:0;
}
</style>
[/code]
[QUOTE=shcKr-;33401372]Maybe be part of the auto-styling by browsers.
In the header section trying adding this:
[code]
<style type="text/css">
body, h1, h2, h3 {
margin:0;
padding:0;
}
</style>
[/code][/QUOTE]
mm, did turn out to be auto-styling by the browser
thank you
[editline]23rd November 2011[/editline]
also another question regarding google fonts, they give you this for example
<link href='http://fonts.googleapis.com/css?family=Bitter' rel='stylesheet' type='text/css'>
I'm using the same (external) styling sheet for every page (the page will always look the same, the text will just be different). Is there a way to put this in the external stylesheet so that I can do something like
#title {
font-family: googlefontname;
}
which would be in an external style sheet and not with internel style sheet
[QUOTE=Eudoxia;33400188]So, the user logs in, his password checks out, and until he logs in a cookie persists containing an ID that was generated exclusively for the user, a small integer that's cheap to store and fast to compare, and tells the server whose HTML it should display.
Is this how a session works, essentially?[/QUOTE]
Don't use a tiny integer, (As TheDecryptor said) you'll want to make it long and complicated so it's not easily guessed.
[QUOTE=BrQ;33401737]mm, did turn out to be auto-styling by the browser
thank you
[editline]23rd November 2011[/editline]
also another question regarding google fonts, they give you this for example
<link href='http://fonts.googleapis.com/css?family=Bitter' rel='stylesheet' type='text/css'>
I'm using the same (external) styling sheet for every page (the page will always look the same, the text will just be different). Is there a way to put this in the external stylesheet so that I can do something like
#title {
font-family: googlefontname;
}
which would be in an external style sheet and not with internel style sheet[/QUOTE]
Just copy their CSS in to yours, shown here:
[code]
@font-face {
font-family: 'Bitter';
font-style: normal;
font-weight: 400;
src: local('Bitter-Regular'), url('http://themes.googleusercontent.com/static/fonts/bitter/v1/SHIcXhdd5RknatSgOzyEkA.woff') format('woff');
}
#title {
font-family:'Bitter';
}
[/code]
[QUOTE=BrQ;33401737]mm, did turn out to be auto-styling by the browser
thank you
[editline]23rd November 2011[/editline]
also another question regarding google fonts, they give you this for example
<link href='http://fonts.googleapis.com/css?family=Bitter' rel='stylesheet' type='text/css'>
I'm using the same (external) styling sheet for every page (the page will always look the same, the text will just be different). Is there a way to put this in the external stylesheet so that I can do something like
#title {
font-family: googlefontname;
}
which would be in an external style sheet and not with internel style sheet[/QUOTE]
Place it before your stylesheet and then it becomes available to the rest below it.
[editline]23rd November 2011[/editline]
[QUOTE=shcKr-;33402540]Just copy their CSS in to yours, shown here:[/QUOTE]
That file is dynamic to provide the most efficient/supported font depending on the browser.
[QUOTE=shcKr-;33402540]Just copy their CSS in to yours, shown here:
[code]
@font-face {
font-family: 'Bitter';
font-style: normal;
font-weight: 400;
src: local('Bitter-Regular'), url('http://themes.googleusercontent.com/static/fonts/bitter/v1/SHIcXhdd5RknatSgOzyEkA.woff') format('woff');
}
#title {
font-family:'Bitter';
}
[/code][/QUOTE]
This worked and does what I want, thanks!
I did hear that some browser won't support it though, so I'll try a few
(edit: seems to work on IE9, chrome and FF. Not IE in compitabilty mode or IE8..)
[editline]23rd November 2011[/editline]
[QUOTE=jaybuz;33402576]
[editline]23rd November 2011[/editline]
That file is dynamic to provide the most efficient/supported font depending on the browser.[/QUOTE]
hmm, how much would that matter?
[editline]23rd November 2011[/editline]
[QUOTE=jaybuz;33402576]Place it before your stylesheet and then it becomes available to the rest below it.
[/QUOTE]
ooh that works even better and is easier, thanks! :D In the beginning I didn't quite understand what you meant, so I did the above suggestion
- snip -
Hi,
I'm trying to embed html5 video but it's not working:
[code]
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css" type="text/css">
</head>
<body>
<table border="0" bordercolor="#000000" width="80%" cellpadding="3" cellspacing="3">
<tr>
<td>
<video width="320" height="240" controls="" autoplay="autoplay">
<source src="1.mp4" type="video/mp4" />
Your browser does not support the video tag.
</video>
</td>
</tr>
</table>
</body>
</html>
[/code]
can anyone see any problems? The video player appears, but nothing plays at all and the time on the video reads 00:00
Thanks
[QUOTE=jetboy;33402421]Don't use a tiny integer, (As TheDecryptor said) you'll want to make it long and complicated so it's not easily guessed.[/QUOTE]
So could I generate a random number (Say, the current UNIX time), pass that to sha1 or another similar algorithm, and store that as the cookie and in a corresponding slot in the user data, compare them as the user browses through the site, delete them when he's logged out and create a new value for both the cookie and the server-stored variable when he logs in again?
That should work, although if you plan to add something that says when a user last logged in, you'll want to salt the hash. Otherwise they could easily get that timestamp, run it through your hashing algorithm, and hijack their session.
Thanks, I'll just either refrain from that or leave some indeterminacy in the "Last logged in" field like, "X hours ago" or something that leaves out too many digits to get the timestamp.
As for encrypting the password, I guess I'll just pass it to one of the SHA algorithms and keep it there.
Snip, never mind.
[QUOTE=Eudoxia;33403995]Thanks, I'll just either refrain from that or leave some indeterminacy in the "Last logged in" field like, "X hours ago" or something that leaves out too many digits to get the timestamp.
As for encrypting the password, I guess I'll just pass it to one of the SHA algorithms and keep it there.[/QUOTE]
Then one would just have to try 3600 different values (for each second in the hour) and they'd be guaranteed to guess it... you really have to include the microseconds or salt it to make it better
[QUOTE=Eudoxia;33403995]Thanks, I'll just either refrain from that or leave some indeterminacy in the "Last logged in" field like, "X hours ago" or something that leaves out too many digits to get the timestamp.
As for encrypting the password, I guess I'll just pass it to one of the SHA algorithms and keep it there.[/QUOTE]
Stop being silly and use a token with sufficient entropy, instead of all these half-assed non-solutions.
[code]
$('html,body').find('span.notify').delay(1200).animate({ marginLeft: -400, opacity: 0},'slow','', $(this).remove() ).fadeOut('slow');
[/code]
The above code works fine apart from one issue. Where it's removing the span [code]$(this).remove()[/code] I want it to remove it once the animation has been completed.
Solved:
[code]$('html,body').find('span.notify').delay(1200).animate({ marginLeft: -400, opacity: 0},function() {
$(this).remove();
});[/code]
[QUOTE=Alcapwne;33403336]Hi,
I'm trying to embed html5 video but it's not working:
[code]
-snip-
[/code]
can anyone see any problems? The video player appears, but nothing plays at all and the time on the video reads 00:00
Thanks[/QUOTE]
I'm guessing you are testing this in Firefox? Firefox doesn't support mp4 video, so you'll have to encode your video in ogg/ogv and add it as a source along with the mp4. The browser will choose the correct type to play. IE/Chrome/Safari all support mp4, some support both.
[code]<source src="1.ogv" type="video/ogg" />[/code]
Video can be .ogv or .ogg, but the type stays the same for both.
WebM is the most compatible, followed by Theora and then H.264.
Chrome is dropping H.264 support, so then it'll just be IE9+Safari that supports it. Compared to WebM/Theora which is supported by Firefox/Chrome/Opera (and IE9/Safari with plugins)
Ah okay, I'm using Opera but it works in Chrome with the mp4, I'll have an ogg version too
thanks
[img]http://beztdesigns.com/v/v/BW2HJETC.jpg[/img]
I'm having troubles with the images not aligning correctly below one another, I've always had this problem for some reason.
Code for each of the image boxes:
[code]div.upload_container span.entry{
padding: 7px;
background: #fff;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
-moz-box-shadow: 0 1px 3px #888888;
-webkit-box-shadow: 0 1px 3px #888888;
box-shadow: 0 1px 3px #888888;
float: left;
margin: 5px 0px 15px 10px;
}[/code]
[QUOTE=kragmars102;33414548][t]http://beztdesigns.com/v/v/BW2HJETC.jpg[/t]
I'm having troubles with the images not aligning correctly below one another, I've always had this problem for some reason.
Code for each of the image boxes:
[code]div.upload_container span.entry{
padding: 7px;
background: #fff;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
-moz-box-shadow: 0 1px 3px #888888;
-webkit-box-shadow: 0 1px 3px #888888;
box-shadow: 0 1px 3px #888888;
float: left;
margin: 5px 0px 15px 10px;
}[/code][/QUOTE]
You're best off posting a link to your page because people are just going to post little attempts like this one.
[code]display: inline-block;[/code]
I tried that, but unfortunately it didn't work. Thanks though. The link to my site is: [url]http://beztdesigns.com/i/[/url].
edit:
Fixed it thanks! I simply removed "float:left" - really odd.
Add the float: left; and it looks right.
[img]http://i.jaybuz.me/20111124110729913.png[/img]
[editline]24th November 2011[/editline]
This is what google use:
[code]
.rg_li {
display: inline-block;
margin: 0 12px 12px 0;
overflow: hidden;
position: relative;
vertical-align: top;
}
[/code]
Then they add the height and width of the image to the style tag at the server-side level, I'm guessing.
Ye I see what they done there. Thanks for the snippet will help me in the future!
[code] Fields = $('input.numfields').val();
Fields++;
$('input.numfields').attr('value',Fields);
var Element = "<span class='container cselect"+(Fields)+"' id='input_"+(Fields)+"'><span class='select"+(Fields)+"'>Select your file...</span><input type=file name='images[]' class='select"+(Fields)+"'><a href='#' class='removeinput' id='input_"+(Fields)+"'>X</a></span>";
$('html body form#upload div.fields').append(Element);[/code]
^ it's a bit messy - sorry. That part works fine it adds a new field once it's clicked. The problem I am having is: Since the new element has been inserted using Jquery, Jquery itself doesn't pick up that appended content which means I can't modify that newly added content in anyway.
e.g of my usage:
[code]$('html,body').find('input[type=file]').change(function(e){
alert('hello!');});[/code]
That prints "hello!" once the field has changed ( this works on the default non appended fields , however it does not work on the appended fields ).
[editline]24th November 2011[/editline]
I can't view page 67? Anyone else?
Anyone know how to do threaded comments? The table schema is pretty obvious, you just need a parent_id field, but I'm confused as to how the SQL should look and how to display them without doing a query for every comment.
[QUOTE=Ortzinator;33424166]Anyone know how to do threaded comments? The table schema is pretty obvious, you just need a parent_id field, but I'm confused as to how the SQL should look and how to display them without doing a query for every comment.[/QUOTE]
select all the comments in the thread at once and sort them yourself if you don't want to do it all in SQL
I'm working on a greasemonkey script, and I need to have a function that is only called when the user clicks a link (a link added by the script, not one on the page already). However, since greasemonkey doesn't work that way, what is a good work around? I was told to use window.localStorage, but I can only seem to store variables in it, and not functions.
I'm still pretty new to javascript in general, so it's probably something easy, but if anyone can point me in the right direction, I'd really appreciate it.
