Posts by K?!

Ok, thx mate.

By the way, I'm using JQuery now for hiding and displaying <p>'s, but the weird thing is, it didn't work with the minified version. It does work with the "development version" (the large file), so my code is correct. Any thoughts on that?

Oh indeed, should've known this, only read it yesterday in the W3Schools tutorial...
Excuse me, and thanks :)

Ok, been playing around with the concept of the script. This is the code I wrote:

function checkSection(){
    var section = document.getElementById("sectionWerkwijze");
    var bubble = document.getElementById("speechbubble");

    var text = "Document Y-offset: " + window.pageYOffset;
    text +=" <br />Section Y-offset: " + section.offsetTop;
    bubble.innerHTML = text;

    if(window.pageYOffset >= section.offsetTop){
        bubble.innerHTML = "<p>De man achter de website...</p>";
    }
}

(code before the "if statement")It displays the y offset of the document and the section (for testing purpose).
(if statement) When the section crosses the middle of the viewport, the text is changed.

This works well in Chrome and FF, but (guess, please, you get three chances...) IE fails... First of all, it asks if the ActiveX content is allowed to execute, I thought IE allowed JS by standard, without scaring off the user? And why does it speak of "ActiveX content" while it's JavaScript?

And second, it just doesn't work, even when I allow the "activeX" content... what's wrong with my code? (or what's wrong with IE?)

EDIT:
One more problem I discovered: The Y-Offset of the section is calculated from the top of it's container div (this is quite some pixels below the top of the viewport, it's unnoticable when the window is fullscreen at 1240*1024, but with smaller window, the section is not even in sight when the value changes...). Is there a way to make JS calculate it from the top of the viewport and not the top of the container DIV?

Uhu, indeed.

Well I must say that I'm a starting web developer. Already have a more then decent undestanding of html/css and php, but I'm pretty new to javascript.

I'll be taking some time to implement the solution, but I think I might want to learn JQuery first (just finished javascript courses). Will it be easier to create a solution to this with JQuery, too?(like they say that everything is easier with JQuery than with JS)

Found this really interesting article: http://stackoverflow.com/questions/123999/how-to-tell-if-a-dom-element-is-visible-in-the-current-viewport

Well, but what kind of bothers me is that I still need to work with pixel values. This will give dificulties.

First of all, if I add content to a section, i will have to change the pixel values of the position of all the sections beneath.
Second, when a user zooms in or zooms out, or just has different default styles for the font (I'm working with 1em standard), sizes of sections will change and the pixel values won't be correct.

Or have I just misunderstood a couple of things?
Greetings, Kenny

That looks like a possible solution, thanks for the effort, but one problem is that I'm trying to create an elastic layout (em widths)

It would be really handy if the content of that div could be determined on the section the user is viewing, not on a number of pixels.

An idea I had is based upon the fact that you can add an ID to an element and then link to that section of the page with href="#IdOfElement". Is there a way to retrieve the section the user is in with JavaScript?

Grtz

Hi all

This is what I want to achieve: a fixed positioned div next to my content area where the text changes depending on the section of the content area the user is reading.

Can this be achieved, and how?

Greetings and thanks in advance, Kenny

oh great :) thanks so much :) It works,

Now I'll need to work around another problem (a previous version of the site already existed and for some content the "content area" is too small because they used pictures that were too wide). But hiding the overflow wasn't an ideal solution so anyways :)

An image says more than a 1000 codes.

See the attachtments:
bspark_chorme.jpg is a screen of the site in Chrome
bspark_ie6.jpg is (obviously) a screen of the site in IE6

Well, It's a website for a primary school, so my guess is that there will be parents with older computers and software... And of course we want them to be able to view the website too...

Hi all

I'm having a major problem here.
Before you read this and think "that's a stupid mistake to make", I'm on an internship and it's my first "real" website. ( I experimented before, but it's the first time I have to make a "finished product) So I hope for some understanding.

I used the following codes:

• Sticky footer: http://ryanfait.com/sticky-footer/
• CSS dropdown menu: http://matthewjamestaylor.com/blog/centered-dropdown-menus

and IETester for testing in different versions of IE.

The sticky footer used to work in IE6 when I first implemented it, but then I forgot about testing in different browsers when continuing the development of the website in the CMS.

My internship is finished on friday and the site still needs to be uploaded. So I need help really quickly.

What do I do, use a script and tell the site only works on IE7 and up (and every other major browser, I tested in Chrome, Firefox and Safari), or still try to solve the problem?

Here's the code:

of the homepage:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>Basisschool Park</title>
    <base href="http://localhost/bsparkoefen/" />
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    <meta name="description" content="" />
    <meta name="author" content="" />
    <meta name="keywords" content="" />
    <link href="favicon.ico" type="image/x-icon" rel="shortcut icon" />
<!-- Opnemen van de CSS bestanden -->
    <link href="assets/templates/bspark/css/raamwerk.css" type="text/css" rel="stylesheet" />
    <link href="assets/templates/bspark/css/opmaak.css" type="text/css" rel="stylesheet" />
    <link href="assets/templates/bspark/css/slimbox.css" type="text/css" …

Sigh...

I've been looking at several solutions, and there's always something about it that just doesn't make it work in my case.

Well, another solution was in JQuery too, so I'm starting to consider it. But what bothers me is the fact that some user might have JavaScript turned of, and then that solution won't work for them either. So I keep preferring a CSS solution.

I found this article too: Faking Minimum Margins. But, as far as I know, this only works if there is no element next to the side of the "minimum margin". Cause I think in my case, the content will be placed with a margin from the menu, not from the border of the browser window.

Ok, first of all, sorry for the late reply, i just started with my internship so I have less time to continue with my own site.

Second, McNeato, thank you for putting your time and effort into this. I'm still going to continue trying to find a CSS solution to this, but if I don't, I have this as a backup, thank you for that ;).

I found some interesting articles at Smashing magazine (check it). I'm first going to check those articles, i think are 2 tips over there that might help solving my problem. ("Pegs: Automate Display: fixed++" and "CSS 100% Height")

Greets, K?!

Ps.: I am just starting as a web developer and I've only just heard about JQuery, that's why I'd prefer to keep it simple with XHTML and CSS.
I have a question about JQuery, is this something clients need to download, or is this automatically supported by all browsers?

First of all, thank you for the quick and usefull replies.

I made a mistake in my previous post, i forgot to mention that i added a min width for the menu, so it wouldn't get too small for it's content.

It works like that as long as "min-width" is not specified for the menu.
If no min width is specified: browserwindow too small -> menu too small
If it is specified, then it shows the result like in the image in my previous post.

Edit: but on the other hand, maybe i should specify a min width for the wrapper instead of for the menu. If the whole site can't get too small, then the menu can't either.

Coding fluid is annoying indeed :p but I think it's a better practice, isn't it?

Grtz

Nop...

Content still goes under menu at small sizes, plus: menu gets overlapped.

Added some text and shrinked browser, check attached image for result.

But thanks for trying to help.

Any other idea's?

Yes, well, except for the fact that "side" will not be an actual element but just right-margin for content.

And i don't want text or images or whatever elements to be placed under the menu when the content's left margin (20%) gets smaller than the width of the menu.

Let's say the width of the menu is a 100 pixels. When the browser window shrinks to 300px width, then the left margin of the content is only 60 px (20% of 300px = 60px). And then it's content will come underneath the menu, but I don't want that.

<div id="header"> 
<div id="titel">Sitename</div> 
</div> 
 
<div id="menu"> 
<ul>
<li><a href="link" title="pagename" >Pagename</a></li> 
<li><a href="link" title="pagename" >Pagename</a></li> 
<li><a href="link" title="pagename" >Pagename</a></li> 
...
</ul> 
</div> 

<div id="content"> 
 some <p>'s and <h>'es...
</div>

#header
{
	border-bottom: 1px solid #E16E04;
	float: none;
	margin-left: 5%;
	margin-right: 5%;
	margin-top: 2%;
}

#menu
{
	float: left;
	margin-left: 5%;
	margin-right: 10px;
	font-weight: bold;
}

#content
{
	margin-top: 45px;
	margin-left: 20%;
	margin-right: 20%;
}

I don't have time now, but I'll post it when I'm home, grtz.

Well, I thought about that too, but the problem is this: I have my menu connected with a 1pixel left border to a 1 pixel border on the bottom of the header.

So this connection has to be pixel perfect, and since I use "em" to define the size of my fonts, if someone has another standard font size, that line will come under or above that border.

Now this works cause i have zero margin under the header and above the menu.

Grtz

No no, I don't want a scrollbar in my menu :P

My site is divided like this: horizontal titlebar and then three vertical bars -> 20% 60% 20%
In the center is the content (ofcourse), the left one contains the menu, the right one contains nothing.

Well, actually, these left and right sidebars don't exist, i just created a margin of 20% left and right on the content div and on the left i've put the menu. (float)

The point is, when the browser gets too small, this 20% of left margin starts getting smaller than the width of the menu, so text starts getting underneath the menu.

So what I want to do is keeping this text, or any content in the "content-div", from going under the menu (a list, or li element)

Hope this makes things a little more clear, if it doesn't I'll try to filter the relevant code and post it later on.

Greetings and thanks for trying to help.

Hi all

Is it possible to specify that NOTHING is allowed to come below an element?

It's like this, if have a menu on the left, and when i make the browser small enough, text starts getting below the menu, and I don't want it to.

I'd rather not create a useless spacer div, if possible.

I can specify a certain amount of padding or margin below the menu, but that's only a certain amount of pixels. It would be nice if i could tell this margin or padding to "go to the bottom of the browser window". But I don't know how to if this is possible.

Thx in advance
Greetings, Kenny.

Ok, thank you.

For example, when I put in min-width=100px; for the left div, it resizes pretty good, and everything stays in the same position, the right div just disappears when the browser window gets too small.

When I set it to 150 px, when the browser window gets too small, the right div jumps UNDER the others...

well, I have tried to create a "liquid" banner (fluid design) that gets wider when the window's width increases. So there are typical 3 div's (left, center, right) (and a container div for these three. Deleted and put it back several times trying things).

But I keep getting these weird results.

I'v put a min-width in the left div, but there is this space thats being preserved in it, whether I have set this min width or not...

I'm not good at making this all clear, ask me questions if you need to know certain things.

I would like an example (cross-browser compatible) of the fluid banner I'm talking about.

This is my html

<div id="banner_container">
	<div id="banner_left"></div>
	<div id="banner_center"><img src="img/banner_text.png" /></div>
	<div id="banner_right"></div>
</div>

This is my css (only for the banner part of course):

#banner_container{
	width: 100%;
	height: 60px;
	/*overflow: hidden;*/
}
#banner_left{
	float: left;
	width: 15%;
	/*min-width: 130px;*/
	height: 60px;
	background: url(img/banner_left.png) no-repeat top right;
}
#banner_center{
	float: left;
	width: 70%;
	/*min-width: 100px;*/
	height: 60px;
	background: #000;
}
#banner_right{
	float: left;
	width: 15%;
	/*min-width: 28px;*/
	height: 60px;
	background: url(img/banner_right.png) no-repeat top left;
}

never mind, solved it with a fluid design approach.

Hi

I'm trying to put this 800x60 banner image on my page, I succeeded to center it, but I don't want it to stay from above the menu on the left.

So, lets say that this menu is 100px wide, then I want a minimum distance of 100px between browser border and banner image, but the image being centralized when browser window is becoming bigger.

Thx in advance

Grtz, K?!

Yes, I know it's kind of interesting, but the problem is that 1: I'm pretty new, and 2: I'm making a website for someone to manage with a CMS, so I might overlook an element he might use lateron, and then it will have no margin or padding. So indeed it will vary in different browsers, but at least it will be there.

I had the margin and padding of the html and the body element set to 0, I would really like to know which element it is that is still preserving a space between the header and the top of the browser window.
If I know that, I can set that specific element's margin and padding to 0, without removing all the other margins and paddings.

I was like "ok, it certainly doesn't do it for me", but it's the

* { padding: 0; margin: 0; }

in the CSS that does the trick.

I am in doubt whether to use this or not. It does the trick indeed, but on the other hand, EVERY margin and padding I need will have to be defined. So when a in the css undefined component pops up, it will have no margin or padding, and that's not really good.

I was wondering if fixed positioning at top 0 is a safe solution?

Hi all

I want a header to stick to the top of the browser window and left and right to it. (pretty standard, right?)

I have configured the following things for this: (never mind the colors, those ar just for testing purpose.)

body {
margin: 0;
padding: 0;
border: 0;

background: black;
}

#header {
background: red;

height: 80px;
width: 100%;
margin: 0;
padding: 0;
border: 0;
}

But Firefox, IE and Chrome are STILL displaying space between the top of the browser window and the header div. (haven't tested other browsers yet)

Any help?
Thanks in advance
Greetings, K?!

Ps: sorry if this question has already been asked.

Oh snap
The problem was just that in the class I downloaded "<?" was used in stead of "<?php". Kind of emberassing, but I think everyone understands that it can take a while before finding that...

I was wondering, is mysqli using mysqlnd or are those 2 different things?

well, it's one of my first projects (non professional of course).
So keeping it easy would be nice :-).
It's only for a website with few visitors so I don't think that will be the problem.

Ok, thx.

I already did a google search before this post, and found some classes, but I'm not sure about using them. They're pretty much the same then the previous class I used, using mysql_...() too. I found classes for PHP 5, but I was looking for PHP 5.3 specific classes. Preferably using mysqlnd. But I'd be glad having something that just works with PHP 5.3.

You talked about draining resources. But I think keeping database access in a class has it's advantages. You can reuse the functions, so that means less code. Difficult things like exception handling are only to be coded once.
Does it really slow down performance so much to call a function from another class than to write the full code each time it is needed.
That seems weird to me, then OO programming would be kind of a stupid thing to do, right?
Or do you mean something else?

I'm don't want to argue or something, I just have my questions about it.

Grtz, K?!

Yes, but I'm talking about classes using those libraries.

It kind of goes like this:

• The downloaded class uses the mysql(i) interface to provide database access and querying. It also implements exception handling.
  example functions: query("SQL Statement"), execute("SQL Statement")
• My extension provides functions to perform specific tasks or get specific information using the functions from the downloaded class.
  example: getUser($userId) does someting like

  return parent::query(
  "SELECT *
  FROM tblUsers
  WHERE userId=".$userId
  ");

• Then I use my extension in other classes where I need that information, so I only have to call on one function instead of using SQL Statements there

It's just an example to show what I want and need, no need to correct the code or something if something is wrong or something ;-).

Anyone?

Hi all

I'm encountering some problems switching to PHP 5.3.
I am now using XAMPP 1.7.2.

I had this database class extended and it worked when using PHP 5.2.9. But after the switch to 5.3 it doesn't. (Today I found out it was originally written for PHP 4 so it's pretty normal it gives errors now)

When I try to import (include/require) this class (or my database class that extends it), I get to see code from that class on the web page. (and of course, it doesn't work)

Does anyone know about a good database class for php 5.3 (preferably using mysqlnd since it's better) and a good tutorial how to install mysqlnd?

Or any other solution?

Thx in advance.
Grtz, K?!

I got XDebug setup in xampp.
Following instructions in this tutorial (also read the comments, there's a littel error): http://www.madbabble.com/install-xdebug-in-xampp.html
I tried it before but it didn't work, but now it does. Make sure you restart xampp every time you make a change trying to make it work.

Yes, I'm already using func_get_args(), but I was wondering how the PHP developers get real method overloading (or at least something that looks like real method overloading), while the solution I use is only is something that comes near to it.

With the real overloading, you can just select the function you need, and you get all thi input parameters as a list (of course you still have to change them, but you get to see what has to come in which position. (in netbeans or other IDE's, won't work in a text editor of course ;))

With the mentioned approach, you need to select, "methodname()" (no arguments), and then that method, according to the parameters you put in, selects "methodname1($param1)", "methodname2($param1, $param2)", ...

It's not like I really need it or something, I just wanted to know why it's not possible for us while the PHP developers succeed to do it (or at least it really looks like it).

First: Oops, it seems like I forgot the attachment.
I posted 2 attachments now, which will make it more clear what I mean.

Answer: uhu, indeed, the solution posted on that site is the solution I used(in a slightly different form) to be able to use method overloading.

Check the images in the attachment, the first one shows a "system method", with good overloading (no "methodname1", "methodname2"), and the second one shows the result if you use the solution from that site.

Why and how is method overloading possible with these php predefined methods, and not with methods from self-made classes?

Hi all

I'm used to programming in Java, which does support method overloading.
So when starting to use PHP, I quickly found that this was not supported in PHP.

But why and how is this supported with "system methods" (I don't know if that name is correct) like, for example, mktime?
see attachment.

Or am I totally wrong and IS method overloading supported? If it is, it did not seem to work when I tried, how am I supposed to do it then?

Thx in advance.
Greets, K?!.

Uhu, I get the point. Thanks.
I have been validating html and xhtml sites before, but it's been a while, and it was only for little sites, made to practice.

I'm going to focus on the programming aspect more at this time, I'd be glad if it just works without being invalid :), tweaking will be for later :).

Thx for the reply.

I heard about XDebug and Zend, one site said "XDebug is best choice", you say "Zend is best". I have no idea what's real for the moment.
Can you give arguments why it is best choice?

To be honest, at this moment, I would be glad if I just had A debug environment up and running. But starting to learn with the best one is always better of course.

I don't have 400€ for Zend IDE. So that's not an option :).

Anyone who knows a link to a good and easy tutorial for setting this up?

Hi all

I would like to start debugging and have been doing some searching on the web, but everything I find is pretty complicated. (I'm just starting to learn web developping)

Does anyone know where to find good, plain, correct instructions, for setting up my environment for debugging?

I'm using NetBeans 6.7 and XAMPP 1.7.1 with PHP 5.2.9.

Thx, K?!

Sorry for answering my own thread:
I use XHTML 1.0 strict, and it seems that the <input> tags are supposed to be within a tag like <p> or something like that, and not just in <form>.
I know this was said clearly in the error, but since w3schools had an example where <input> was just put into <form>, I didn't get it.

Is what I'm saying correct? And does anyone know, if it is correct, why this has changed in xhtml?

Hi all

I'm having a problem with netbeans when I try to make af form. It gives an error when it's not supposed to. At least, as far as I know it's not.

An image can say a thousand words: check the attachment.

Any help? I know this is not really about php, but I suggest there will be more people using netbeans here then in the HTML/CSS section, since netbeans is a programming environment.

Thx in advance.
Grts, K?!

Hi again

Sorry for posting three times in a row and answering my own threads =D.

I have installed netbeans 6.7 now and it works there. I don't know how to solve the problem in netbeans 6.5, but it doesn't really matter anymore.

Grtz, K?!

Here's some extra info: the code completion does work when programming in Java.
EDIT: And all my autocompletion options are marked. Except for "Case sensitive code completion", but that shouldn't be the problem I guess

Hmmm, I tried it, and it didn't really work.
And even if it did, if I have to do this for every variable... It would be nice if would be possible just to make it work automatically.

Thx for your effort.

Grtz, K?!

Hi all

I'm am using Netbeans 6.5 on ubuntu for programming PHP.

When I create an instance of a class and type "->" after the variables name, I don't get to see any methods. Even when I press CTRL-Space, it only says "No suggestions"...

Code templates do work (like typing "fnc" and pressing tab to get a function template).

Can anyone help me out please?

Thx in advance
Grts, K?!