-
1. Re: Question about jquery, if I'm honest - I'm just after the code!
the_shocker Jan 21, 2011 2:11 PM (in response to luadke)Just to be clear: you don't want links to resources or information on how to do it yourself. You just want someone that has spent the time learning the code to then happily code it for you... for free. Is this an accurate summation of your request?
I'm sure someone would be happy to code it for you if you put an ad on craigslist or project4hire or something and included how much you are willing to compensate.
-
2. Re: Question about jquery, if I'm honest - I'm just after the code!
luadke Jan 22, 2011 10:07 AM (in response to the_shocker)Well not really, I am happy to learn it. But from searching in lots of different places for a while now I still haven't managed to get my head round it. Whereas in my experience - when I see the code for the specific thing I am trying to accomplish it all becomes a lot clearer (I start to understand the code)
I admit the post title is a bit misleading
-
3. Re: Question about jquery, if I'm honest - I'm just after the code!
the_shocker Jan 21, 2011 7:20 PM (in response to luadke)<!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">
<head>
<meta http-equiv="content-type" content="application/xhtml+xml; charset=UTF-8" />
<title>the_shocker</title>
<script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.8/jquery-ui.min.js"></script>
<style type="text/css">
<!--
#the_effect {
float:right;
display:none;
margin-left:100px;
width:800px;
}
.links {
float:left;
width:100px;
}
.clearfloat {
clear:both;
height:0px;
font-size: 1px;
line-height: 0px;
}
-->
</style>
</head>
<body>
<!-- container required to validate strict for clearfloat linebreak at end of container -->
<div>
<div id="the_effect">
<p>I would like this div to be hidden at first and when one of the menu links is clicked for it to slide in from the right hand side of the browser.</p>
</div>
<div class="links">
<a href="#" id="effect_link">Run Effect</a>
</div>
<br class="clearfloat" />
</div>
<!-- end container -->
<script type="text/javascript">
<!--
$("#effect_link").click(function() {
$("#the_effect").toggle("slow");
return false;
});
-->
</script>
</body>
</html>
-
4. Re: Question about jquery, if I'm honest - I'm just after the code!
luadke Jan 22, 2011 3:58 AM (in response to the_shocker)Thanks you so much for that, a massive help.
I've put up a temp version here http://blackpaint.co.uk/new/temp.html
Could you tell me how to make it so that when 'trigger two' is clicked the previous opened div (linked to 'trigger one') is closed (so that they don't stack up in an ugly way that you can see one the page now). Is there a way for this command could be saying 'close all' rather than me having to write each div id to close. I hope that makes sense, it is so that when I add new content I won't have to updated each javascript segment.
This leads me onto another question - I have worked out that in order to have multiple instances of triggers opening divs you have to create a new version of everything. You can see in the code I have duplicated the '#the_effect' css style and named it '#the_effect1' , I did the same with the javascript. Is this the cleanest way to do this? Is there a way I can leave the CSS and Javascript alone and only add to the html?
Finally - you can see that I'm loading an external html page in the div using an iframe, is this the best way to have an external page in the sliding div?
Many many thanks
Luke
-
5. Re: Question about jquery, if I'm honest - I'm just after the code!
the_shocker Jan 22, 2011 3:18 PM (in response to luadke)I had a feeling you'd be back: give 'em an inch and they ask for a mile.
Is there a way for this command to say 'close all' rather than me having to write each div id to close? It is so that when I add new content I won't have to update each javascript segment.
With dynamic content updating your script and content is easy because it's automated. Simply update your database and the script/content is automagically updated. You currently have a static example but it is easy to convert this to a dynamic app. Simply loop the results of the recordset for content divs, each with their own unique ID from database as a container id on your page. Then do the same technique for the script: loop the recordset to display the script so that all the triggers correspond to the content divs. Static content requires manual updating.
If you're pulling content from a website other than your own then iframe is the best method for inexperienced users. If the content from another source has an RSS feed you can obtain the feed and parse it to display content instead of an iframe. There's other methods as well but they require additional programming knowledge. For now it's probably best to stick with what works for you and focus on other specifics in another discussion thread since it's a different topic than the jquery functionality you're after in this discussion.
Take a look at this script. Note that the function will hide the other div ids before the new content id is toggled.
<script type="text/javascript"> <!-- $("#effect_link").click(function() { $("#the_effect1").hide("fast"); $("#the_effect").toggle("fast"); return false; }); $("#effect_link1").click(function() { $("#the_effect").hide("fast"); $("#the_effect1").toggle("fast"); return false; }); --> </script> -
6. Re: Question about jquery, if I'm honest - I'm just after the code!
luadke Jan 23, 2011 10:32 AM (in response to the_shocker)Course I'm back, and with more questions. But I'll make this the last.
Thanks for the info on adding content I'll look into integrating dynamic content later on.
How can I make it so that the div holding the iframe slides on rather than slides and expands as it is doing now. Here is my working page - http://blackpaint.co.uk/new/ . I tried looking at the code here but could make it work: http://www.learningjquery.com/2009/02/slide-elements-in-different-directions. So basically just making it move on the x axis and for the content not to resize inside.
And another problem is browser compatibility. Chrome reads it well, IE doesn't even load the bg image (but I think this might be to do with the script for the background images so I'll post that as a new thread). Safari doesn't do slide the animation, and firefox is not showing the iframe correctly (is this more to do with my css and iframe height settings?)
Once again, many many thanks for helping so far, and I'll try and make that my last
L
-
7. Re: Question about jquery, if I'm honest - I'm just after the code!
the_shocker Jan 23, 2011 11:55 AM (in response to luadke)Nice video. Problem there though. Click link one, play video, then click link 2. Party foul: link one's video still plays in the background!
-
8. Re: Question about jquery, if I'm honest - I'm just after the code!
luadke Jan 23, 2011 11:59 AM (in response to the_shocker)Dammit! Thanks for pointing that out. I'm guessing the only way to solve this is to have all my sub-menu content in div (not iframes in divs). Will that even solve it?
I would really prefer to have iframes though
-
9. Re: Question about jquery, if I'm honest - I'm just after the code!
the_shocker Jan 23, 2011 12:15 PM (in response to luadke)Again, it's another discussion, just thought I'd point it out. You'd have to use a player that communicated to the other players on the page so that if one is currently playing and then another is started the first video pauses. See this flowplayer example: http://flowplayer.org/demos/installation/multiple-players.html
I'd stay as far away from iframes as possible.
-
10. Re: Question about jquery, if I'm honest - I'm just after the code!
luadke Jan 23, 2011 12:18 PM (in response to the_shocker)Hmmm, problem is, I really need to stick to vimeo. Do you have any suggestions of how to do this? I'll start up another thread. Thanks
Any ideas for my other questions three posts up? Greatly appreciated


