Showing posts with label jquery. Show all posts
Showing posts with label jquery. Show all posts

Thursday, October 11, 2012

Finding an ideal directory structure

My recent forays into coding have left me with some pretty confusing directory structures. I tend to break up my directories thusly: (I'm talking about web dev for the time being)

[myProj] - project
    [scr] - scripts
        [php and javascript files that store functionality]
    [mod] - modules
        [php scripts that will be include()d and rendered on the page]
    [img] - images
        [pictures and such]
    [css] - style
        [css files]

An avid onlooker would notice that where I can, I name my folders a three letter abbreviation of their full name. This is because I am lazy.

Tuesday, October 2, 2012

Awesome uploading gif generator!

I don't spruik much but I just found this and it's awesome

Loading GIF generator

I am always trying to find decent free loading gifs and that has a selection of pretty much all the ones you ever see on the net. I thought it worth noting down in case I am looking for it again later.

Sunday, July 31, 2011

toggleSlide() and while loops.

I came across a problem tonight

That I thought I'd share a solution to. I was mysql_fetch_array()ing in a while loop to output a bunch of data in seperate divs, and since it was getting bulky and cluttered I decided to add a toggleSlide() so I could collapse them individually.

So I decided to supply an argument in the form of the entry id returned by the loop. I appended the id to the end of the divs in the loop and to the argument of my slide() function using a PHP echo. And this is where I hit a snag.

When you give toggleSlide() an argument and put it in the onclick selector, it accumulates your clicks. This must have something to do with the + sign you need to use when you add the argument. What this means is that

Function slide(arg) {
$('document').ready(function() {
$('#button'+arg).onClick(function() {
$('#slider'+arg).toggleSlide();
});
});

Will have an odd and unexpected effect. The first click won't have an effect at all, the second click will slide up and then back down, the thid click will move three times and so on. The trick here is to add an unbind() command to the button element. So

Function slide(arg) {
$('document').ready(function() {
$('#button'+arg).onClick(function() {
$('#slider'+arg).toggleSlide();
$('#button').unbind('click');
});
});

Will have your loop returned divs sliding around nicely!

Just to clarify, the div returned by your loop would look like this:

<div id="button<?php echo $id; ?>" onclick="slide(<?php echo $id ?>)"><img src="someimage.png" /></div>
<div id="slider<?php echo $id; ?>">Some content</div>

Look at me, gettin all tutorialicious and junk.

Monday, July 25, 2011

JQuery and I

I am an avid modeler,

And a not so avid coder. I don't get the same kind of relaxation and fun out of coding as I do modelling. I enjoy myself thoroughly, but it's hard to love cricket when you can't swing a bat. I think it's the learning I like. Working at my job doesn't give me too many opportunities to demonstrate intelligence, and learning stuff helps me fill that gap. So coding isn't so much a hobby as it is a means to an end.

But tonight I found jQuery

And found a reason to enjoy the shit right out of web development. I had been skeptical about using it because I have already had to teach myself php, javascript and the nuances of ajax, I didn't think I was really ready for another language just yet. Man I should have started with jQuery. I have been used to following tutorials for hours to get the basics down, and then inferring stuff and googling and whinging to psi on the wolfire irc and taking a generally monumental amount of time to make any real progress in my code. Tonight I slipped jQuery.js into my head and immediately went shooting across the galaxy on a blazing fireball of solidified awesome.

The reason I picked it up was because I wanted a nice slide effect for a div so I could hide and show it onclick. I found what I thought to be a very ominously unpromising example. 6 lines of code and assigning a few classes/id's. I copypasted it into my js.js, changed a few parameters and refreshed my page, wincing at the thought of the hours of frustration I had just resigned myself to.

It immediately worked just as planned.

Better than planned. My div slid smoothly away to its little hiding spot, and even did a little bouncy bit when it extended. I emptied the contents of my testacles straight into my pant leg. I sat there for a good half hour just opening and closing my div.

Hopefully this is the heralder of some more fantastic functionalities for my future forays into the field of javascript. I'm going to make so many slidey fadey movey divs on my site that you'll think you're watching a remake of Tron.