Okay, so I'm trying to get into this whole HTML 5 thing, and this tutorial (http://www.webreference.com/authoring/languages/html/HTML5/) says that these tags should move the content around without any kind of CSS at all, but all I'm getting is a line of text that looks like this:
Header tag Nav tag Artical Section tags Aside tag footer tag
Here is the code:
<!DOCTYPE html>
<html lang="en">
<head>
<title>HTML5 test1</title>
<meta charset="utf-8" />
</head>
<body>
<header>
Header tag
</header>
<nav>
Nav tag
</nav>
<article>
<section>
Artical Section tags
</section>
</article>
<aside>
Aside tag
</aside>
<footer>
footer tag
</footer>
</body>
</html>
Hi, i've created a script that works with the Dom so it has to wait until the Dom is ready before execute every operation. I want that this script can be included in two ways:
In the head tag so that it is loaded before the Dom is ready. I've used document.addEventListener("DOMContentLoaded",function(){...},false) for this and it works well
Loaded dinamically when the Dom is already loaded. In this case the script doesn't work because for some reasons if the Dom is already loaded the DOMContentLoaded event isn't fired
So i want to know, is there a way to check if the Dom is already loaded so that the script can execute the code without using the DOMContentLoaded event?
I use the following to download a file with PHP:
ob_start();
$browser = id_browser();
header('Content-Type: '.(($browser=='IE' || $browser=='OPERA')?
'application/octetstream':'application/octet-stream'));
header('Expires: '.gmdate('D, d M Y H:i:s').' GMT');
header('Content-Transfer-Encoding: binary');
header('Content-Length: '.filesize(realpath($fullpath)));
//header("Content-Encoding: none");
if($browser == 'IE')
{
header('Content-Disposition: attachment; filename="'.$file.'"');
header('Cache-Control: must-revalidate, post-check=0, pre-check=0');
header('Pragma: public');
} else
{
header('Content-Disposition: attachment; filename="'.$file.'"');
header('Cache-Control: no-cache, must-revalidate');
header('Pragma: no-cache');
}
//@set_time_limit( 0 );
ReadFileChunked(utf8_decode($fullpath));
ob_end_flush();
The source code of ReadFileChunked is:
function ReadFileChunked($filename,$retbytes=true)
{
$chunksize = 1*(1024*1024);
$remainFileSize = filesize($filename);
if($remainFileSize < $chunksize)
$chunksize = $remainFileSize;
$buffer = '';
$cnt =0;
// $handle = fopen($filename, 'rb');
//echo $filename."<br>";
$handle = fopen($filename, 'rb');
if ($handle === false) {
//echo 1;
return false;
}
//echo 2;
while (!feof($handle))
{
//echo "current remain file size $remainFileSize<br>";
//echo "current chunksize $chunksize<br>";
$buffer = fread($handle, $chunksize);
echo $buffer;
sleep(1);
ob_flush();
flush();
if ($retbytes) {
$cnt += strlen($buffer);
}
$remainFileSize -= $chunksize;
if($remainFileSize == 0)
break;
if($remainFileSize < $chunksize)
{
$chunksize = $remainFileSize;
}
}
$status = fclose($handle);
if ($retbytes && $status) {
return $cnt; // return num. bytes delivered like readfile() does.
}
return $status;
}
The question is :
The file downloaded will contiain some html tags which are the content of the html code generated by the php.
The error will happened when downloading the txt file with the file size smaller than 4096 bytes.
Please help me to slove this problem , thank you very much!
Chu
So I'm trying to add a badge to the top right corner of a site I'm doing some work on. z-index works to float the object above the page content but each time i try to use position relative the background image disappears only position absolute shows the image. I don't really want to use absolute as the image needs to be positioned on the right hand side of the sites menu bar not the right hand side of the viewport.
Any thoughts or advice appreciated
<div class="badge-box">
<a href="http://www.google.com" class="badge">Book Now!</a>
</div>
<div id="header">
<a href="index.php"><img src="images/pixel.gif" width="378" height="31" alt="Welcome to Gwynfryn Farm Cottages" /></a>
</div>
<div id="main-menu">
<div>
<a href="/">Home</a>
<a href="/cottages.php">Our Cottages</a>
<a href="/gwynfryn.php">Bed & Breakfast</a>
<a href="/rates.php">Price Guide</a>
<a href="/llanbedr.php">Location & Local Attractions</a>
<a href="/news.php">News & Special Offers</a>
<a href="/contact.php">Contact Us</a>
</div>
</div>
.badge-box {
width: 1030px;
margin-left: auto;
margin-right: auto;
border: 0px solid red;
}
.badge {
background: url(../images/badge.png) 0px 0px no-repeat;
width: 148px;
height: 148px;
text-indent: -10000px;
position: relative;
z-index: 999;
}
#header {
width: 960px;
height: 40px;
margin-left:auto;
margin-right:auto;
margin-top:20px;
padding: 20px 0px 0px 20px;
background: #58564f url(../images/header-top-background.png);
}
#main-menu {
width: 980px;
margin-left: auto;
margin-right: auto;
height: 35px;
/*background: red;*/
background: #58564f url(../images/header-bottom-background.png);
font-family: Georgia, "Times New Roman", Times, serif;
}
#main-menu div {
width: 776px;
height: 35px;
margin-left: auto;
margin-right: auto;
background: blue;
}
#main-menu div a {
display: block;
float: left;
padding: 5px 10px 0px 10px;
height: 30px;
color: #FFFFFF;
font-size: 1.2em;
text-align: center;
background: green;
}
#main-menu div a:hover {
background-color: #333333;
}
Greetings, I have a problem which would seem to involve some kind of z-index issue, but for a change it's in everything except IE.
If you take a look at http://cougar.motivo.com.au/ in anything except Internet Explorer and hover over the last menu item "Contact Us" you can se what I'm referring to. Basically the supersub menu appears to be being trimmed by the width of the element below it.
You can see via the source that I've tried setting z-indexes & position:relative, but at this point I'm stumped. Any and all input would be gratefully received :)
P.S. I am aware that there are still a couple of issues in IE6. I am yet to have the pleasure of addressing those (groans).
I am running Selenium Grid and most of my Scripts fails due to unable to delete FF cookies.
Each testcase needs to delete browser cookies .If any one aware of this please let me know.
The ajax call works fine in FF.
the data returned is in JSON here is an example from FF firebug -
{"noProfiles": "No profiles have been created, lets start now !"}
When I try to print the error in IE8 (& in compatibility modes as well), it says "parsererror".
But the output seems to be valid JSON.
Here is the ajax function call I'm making.
Any pointers would be great !
$.ajax({
type: "GET",
url: "/get_all_profile_details/",
data: "",
dataType: "json",
beforeSend: function() {alert("before send called");},
success: function(jsonData) {
alert("data received");
},
error: function(xhr, txt, err){
alert("xhr: " + xhr + "\n textStatus: " + txt + "\n errorThrown: " + err);
}
});
The alerts in the error function above give -
xhr:<blank>
textstatus:parsererror
errorThrown: undefined
Any pointers would be great !
Note : jquery : 1.3.2
I cannot get scroll to work, here is the complete stuff:
http://zed.mit.edu/scroll2/buc.php
I'm trying to refresh the page while maintaining the scroll position of the iframe inside.
I'd like to have an alert when I actively scroll the iframe, these two both fail:
$(top).frames['#iframe_bucinid'].scroll(function() ....
$('#iframe_bucinid').scroll(function() ...
The page's iframe is defined as:
<iframe class="inframe" src="bucin.php" name="bucin" id="iframe_bucinid">
Notice that getting the scrollTop works with
top.frames['bucin'].document.body.scrollTop
Here a short test to demonstrate my problem. I have a page that loads an iframe:
<html>
<head>
<title></title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"></script>
</head>
<body>
<iframe id="iframe" src="box.html" style="width: 100px; height: 100px"></iframe>
<script>
$('#iframe').bind('load', function () {
var div = $(this).contents().find('div');
alert(div.height());
alert(div.innerHeight());
alert(div.outerHeight());
alert(div.outerHeight(true));
});
</script>
</body>
</html>
The iframe (box.html) contains a single styled div:
<html>
<head>
<title></title>
<style>
div {
height: 50px;
width: 50px;
margin: 5px;
padding: 5px;
border: 2px solid #00f;
background-color: #f00;
}
</style>
</head>
<body>
<div></div>
</body>
</html>
The four alerts should return 50, 60, 64 and 74, respectively. This works as expected in Safari and Chrome. In FF 3.5.1, they all return 64. This is wrong.
Does anyone know how I can force FF/jQuery to return the correct values?
Hi! This is a quite weird and annoying problem, which is reproduced with the script below.
Say we have two pages: script.php and script.php?second.
Page 1 creates some database entries and redirects to page 2.
On page 2, the user is presented with an editor for said entries.
If page 1 for some reason crashes on the first try, and prints some error message, a strange thing will happend. If we refresh page 1 (and this time it redirects fine), every consecutive refresh (of page 2) will actually refresh page 1 and again redirect to page 2.
In the above example this would create new database entries for every refresh, which is the problem I want to circumvent by redirecting to page 2.
<?php
header('Content-type: text/plain');
session_start();
if (!isset($_GET['second'])) {
$_SESSION['counter'] = isset($_SESSION['counter']) ? $_SESSION['counter'] + 1 : 1;
/*$_SESSION['counter'] = 0;
exit('asd');*/
header("Location: {$_SERVER['PHP_SELF']}?second", true, 303);
exit;
}
echo "Counter: {$_SESSION['counter']}";
To try the above complete script, first run it with the commented code intact, then by enabling the commented code.
I've tried 301, 302 and 303 redirections. Does someone know why this is happening?
I have a problem with my form when I try to submit with ajax. I am using Malsup Form plugin for Jquery but also using tinyMCE editor. When I submit the form and check the $_POST array, there is no data from the textarea. I have tried to use the triggerSave() function but to no avail. Everything is working well in IE.
// These options are common and will be used for many form submissions
var options = {
target: '#notice', // target element(s) to be updated with server response
dataType:'html',
resetForm:true,
beforeSubmit: function(){tinyMCE.triggerSave(false,true);
},
success:function(msg){
$('#notice').html( msg)
refresh(3)
}
};
//prepare form
$('#savetext').ajaxForm(options);
Hi all. I have a contact manager program that I'd like to design for multiple network marketing companies. My desired structure would include a core program which covers basic contact management functions. After that one could purchase a module for their specific network marketing company. This module would contain a variety of controls that the original program would need to be able to manipulate. Here is an example of what it would have to have:
A group box containing buttons that link to a genealogy view, and the option to import one's donwnline from the back office provided by a company.
A panel which is displayed on the contact page allowing the user to input business information or which will be filled by importing a downline from the back office: ie business ID, qualification level, sponsor information etc.
a panel displayed when one searches for contacts on the contact list page which allows the user to sort based on information such as when they joined, what their business id is and so forth.
a panel which is displayed in a personal business overview page which presents to an individual how many people in their downline are at each qualification level and develop a mailing list for individuals of a certain qualification level.
I have the code developed to perform all these functions, I just wanted to give you an example of what needed to be done. I'm thinking that what I'm trying to create is a library that one can download and the program will recognize, but I'm not really sure where to go. What I'm really trying to do is figure out what kind of file I can make that will contain all this code and the GUI information that the program will recognize.
Any ideas?
With thanks,
John
hello all..
i want to ask something about popup ..
how to create popup panel in my addons to show text when users click context menu?
the popup panel will execute javascript function inlinetrans.process() to show the result of inlinetrans process.
this is my code to show context menu :
<popup id="contentAreaContextMenu">
<menuseparator />
<menuitem id="inlinetransContextMenuPage"
label="Terjemahkan dengan inlinetrans"
image="chrome://inlinetrans/skin/imagesOn.png"
class="menuitem-iconic"
hidden="false"
onclick="inlinetrans.process();"/>
</popup>
i want to create pop up like this http://abcdefu.wordpress.com/2008/07/25/writing-beautiful-ui-with-xul/
i don't need text box but i need to display my result of translation, what should i do?
thank you for helping me..:)
Sometimes, the slideshow on my website, which uses fadeOut and fadeIn to cycle through three main images, will fadeIn a new photo without fading in the old one. This doesn't happen every time the page loads though.
My site is here (the slideshow will take 7 seconds to change):
http://codersarepeople.com/v2/
The code I use is this:
slideshow = new Array('#slideshow1','#slideshow2','#slideshow3');
var i = Math.floor(Math.random()*3);
$(slideshow[i]).fadeIn(125);
var t = setInterval(function() {
$(slideshow[i%3]).fadeOut(250,function() {
$(slideshow[(i+1)%3]).fadeIn(250);
});
i++;
},7000);
Hi guys,
I've just installed and setup sIFR on my Magento store. An example page can be seen here:
http://www.mint-creative.co.uk/shop
And you can see it loads the heading brilliantly, but still displays the alternate text-only headline. I've quadruple checked the .css files and everything's loading ok I think. Also, in IE it doesn't display at all and every .css and .js file has an error according to the error log in IE8.
Any help on this would be great as it's an urgent project!
Cheers.
I have this code below and as a test i have that alert below.
When i open firebug and i put a break point on the "debugger" and it doesn't fire but the alert does get called as a i get a alert popup.
Any idea why i can't capture this breakpoint ?
<script type="text/javascript">
$(function() {
$("#tabs").tabs({
selected: 0,
load: function(event, ui) {
debugger;
alert(ui.panel.id);
}
});
Hi Expert,
I am creating Mozilla extension.
Here I need to set button controller right side in extension.
Here I divide XUL file to div element. I have take a main div element and inside this i have take two more inner div.
Then I have set one inner div style property float:left; and another div style property float:right. But this is not helpful for me.
Here I also set Button CSS style property float:right which is inside the div which have property float:right.
Awaiting for your response. Thanks in advance
I have a form that will have dynamic elements inserted with javascript and am experiencing some strange behavior. When I click the button to add another element to the table in the form, it adds the element but seems to to a form post immediately (without intending to submit the form yet)
I have created a simplified example of the page that has the same behavior. the first table element is created on page load and subsequent elements are added when clicking on the button. this form works successfully in IE. does anyone have an idea of how to prevent this behavior?
here is the code sample.
<!DOCTYPE html>
<html>
<head>
<title>Test Creating Form</title>
<meta http-equiv="Content-type" content="text/html;charset=UTF-8">
<style type="text/css">
td{font-family:verdana;}
</style>
<script type="text/javascript">
var counter = 0;
function makeTitle(title){
if(counter){
title += " " + counter;
}
counter++;
var tbl = document.getElementById('tbl');
var tr = tbl.insertRow(-1)
var td1 = tr.insertCell(-1);
td1.innerHTML = title;
}
function load1(){
makeTitle('Primary Specimen');
}
</script>
</head>
<body onload="load1();">
<form action="formtest.htm" method="post" name="testForm" id="testForm">
<table id="tbl" border="1"></table>
<button onclick="makeTitle('Alternate Specimen')" id="clone" >Add Another Specimen</button>
</form>
</body>
</html>
Hi,
I have this page.
login: [email protected]
password: m
As you can see in IE7 there isn't any border below 'Alcorcon', 'Madrid', etc. In FF yes.
Why?
Regards
Javi
I'm having trouble with the alignment of two images on the footer of my temporary website (http://www.rotimioyewole.com). I'm new to the YUI grid, which I think may be a factor.
It should look roughly like this (works correctly in Chrome and Safari, haven't tested IE yet):
(http://cl.ly/44fH)
But on FF and Opera look like this:
http://cl.ly/44aO
If I can have some sort of consistency then the website would at least be presentable. Ideally, I would also like to align both images on the same Y axis, as well as the text next to the icons. I had trouble figuring out how to search for a solution..can anybody help me?
Thanks in advance
#allday {
width: 180px;
height: 20px;
margin-top: 2px !important;
margin-right: 0px;
padding: 0px;
-webkit-appearance: menulist;
box-sizing: border-box;
-webkit-box-align: center;
border: 1px solid;
border-image: initial;
white-space: pre;
-webkit-rtl-ordering: logical;
color: black;
background-color: white;
cursor: default;
}
I inspected the element in both browsers but I'm not really seeing where the discrepancy is. Has anyone been through this before with the select tag?