Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Page 2 of 2 FirstFirst 12
Results 16 to 27 of 27
  1. #16
    New Coder
    Join Date
    Jan 2013
    Location
    Florida
    Posts
    75
    Thanks
    2
    Thanked 0 Times in 0 Posts
    excellent. i think i can just rattle off what is going on : onclick establishes a string variable that is passed into the function, which was set up to take in a parameter, and the parameter is the string variable, and the function manipulates the properties associated with the parameter named object (getting info from it and placing that info in the divs).

    sounds like what you said.

    you know, i think if yesterday i had seen that excellent link you just sent me, that i could have figured most of it out by myself. as it was i thought i was about ready for the bughouse.

    now i am going to study that Mozilla source site, and get more comfortable with what you did.

    then it is on to your second code.

    thank you sir. being that this is my first excursion into CodingForums.com, i will ask you a question as to the normal procedure here. there are 2 things i don't understand ; this official thanking procedure (when it is normal to use it), and is there a way to label my thread as solved ?

  2. #17
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Posts
    3,020
    Thanks
    56
    Thanked 566 Times in 563 Posts
    You're welcome.

    It's a while since I marked a thread as solved, but I think I recall that you can go to the first post in the thread, edit it and mark it as resolved. But from memory, that option expires.

    I wouldn't sweat it too much - probably about 1% of posters here mark their threads as resolved.

    As for thanks, I think it says in the pop up, something about how you should only use it for posts where alot of thought or effort went into it.

    Again, it's up to you. I'm not sure that anybody really pays much attention to that stuff either.

  3. #18
    New Coder
    Join Date
    Oct 2010
    Posts
    56
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Hello, this helped me a lot as I was doing something similar. I have a question, maybe it will help the OP as well.

    I have a gallery which is basically working, but it works much slower than I would expect. Also if I refresh the page with the debugger open (I'm using Chrome), it pauses the script and doesn't do anything until I close the debugger. I'm guessing that something is continuously running, but I'm not seeing any errors. Here is my code:

    lb.js (yes this is all I have in my js so far):
    Code:
    function changepic(thepic)
    	{
    	var picM = document.getElementById('imgdsp2');
    	var path = "./img/";
    	picM.src = path + thepic + ".jpg";
    	}
    lb.php:
    Code:
    <!doctype html>
    <html>
    <head>
     <meta name='Quick Gallery Test' />
     <link rel="stylesheet" type='text/css' href='styles.css'>
     <script type='text/javascript' src='lb.js'></script>
     </head>
     <body>
    	<div id='header'>THIS IS SOME TEXT IN A HEADER</div>
    	 <div class='imgwrapper'>
    	<?php
    		$TNimgDir = "./img/tn/*";
    		$imgDir = glob('./img/*');
    		foreach (glob($TNimgDir) as $image)
    			{
    			$string = $image;
    			$pos = 8;
    			$str1 = substr($string, 0, $pos);
    			$str2 = substr($string, $pos + 1, $string - 4); // this used to be a number that I had manually counted.
    			$str3 = substr($string, $pos);
    			echo "<img src='" . $image . "' class='img1' onclick='changepic(this.id)' id='" . $str2 . "'/><br />";
    			}
    		echo "<div class='imgdsp1'><img src='" . $imgDir[0] . "' class='imgdsp2' id='imgdsp2' /></div>";
    		?>
    	 </div>
    	 <div id='foot-place-holder'>&nbsp;</div>
    	<div id='footer'>THIS IS SOME TEXT IN A FOOTER</div>
     </body>
     </html>
    and (not that it will matter) styles.css:
    Code:
    html, body
    	{
    	height:100%;
    	background-color:#666666;
    	}
    #header
    	{
    	background-color:#222222;
    	z-index:1000;
    	color:#FFFFFF;
    	position:fixed;
    	top:0px;
    	left:0px;
    	width:100%;
    	height:150px;
    	}
    #footer
    	{
    	z-index:1000;
    	background-color:#222222;
    	color:#FFFFFF;
    	position:fixed;
    	bottom:0px;
    	left:0px;
    	width:100%;
    	height:100px;
    	clear:both;
    	}
    #foot-place-holder
    	{
    	z-index:1;
    	position:fixed;
    	bottom:-150px;
    	left:0px;
    	width:100%;
    	height:150px;
    	}
    #mainwrapper
    	{
    	z-index:1;
    	background-color:#000000;
    	position:absolute;
    	top:150px;
    	left:0px;
    	width:550px;
    	height:100px;
    	border-top:5px solid #666666;
    	border-left:5px solid #666666;
    	border-right:10px solid #000000;
    	border-bottom:10px solid #000000;
    	-moz-border-top-left-radius:15px;
    	border-top-left-radius:15px;
    	-moz-border-bottom-left-radius:0px;
    	border-bottom-left-radius:0px;
    	}
    .img1
    	{
    	width:60px;
    	height:45px;
    	opacity:0.6;
    	filter:alpha(opacity=60);
    	}
    .img1:hover
    	{
    	width:120px;
    	height:90px;
    	opacity:1;
    	filter:alpha(opacity=100);
    	}
    .imgwrapper
    	{
    	padding-top:150px;
    	padding-bottom:150px;
    	}
    .imgdsp1
    	{
    	position:fixed;
    	top:250px;
    	left:300px;
    	}
    .imgdsp2
    	{
    	z-index:1000;
    	width:600px;
    	height:450px;
    	}
    I'm using php to get the contents of a thumbnail directory (and show the thumbnails), then pulling the filename (without extension) in to the id of the thumbnail. Then my javascript uses the filename of the thumbnail which received a click to create a path to the original image, and sets the src of my large image to that original image.

    Any thoughts about what could be causing this to run slow? On thing I noticed is that the id that gets created has the extension (.jpg in this case) when I don't believe it should (edit: the extension part is fixed)

    edit #4?: It seems to not have this problem in IE9. I'm guessing the little bit of lag when clicking a thumbnail to when it displays the larger image is the browser loading the much larger original image. So the only issue is the 'paused in debugger' issue I have with Chrome.
    Last edited by Prime8; 01-04-2013 at 06:12 PM.

  4. #19
    New Coder
    Join Date
    Oct 2010
    Posts
    56
    Thanks
    2
    Thanked 0 Times in 0 Posts
    I cleaned up some things I realized weren't doing anything in my php.

    Code:
    <?php
    		$TNimgDir = "./img/tn/*";
                    $imgDir = glob('./img/*');
    		foreach (glob($TNimgDir) as $image)
    			{
    			$pos = 8;
    			$str2 = substr($image, $pos + 1, $image - 4); // this used to be a number that I had manually counted.
    			echo "<img src='" . $image . "' class='img1' onclick='changepic(this.id)' id='" . $str2 . "'/><br />";
    			}
    		echo "<div class='imgdsp1'><img src='" . $imgDir[0] . "' class='imgdsp2' id='imgdsp2' /></div>";
    		?>
    This is for information only, it hasn't affected the problem I'm having.

  5. #20
    New Coder
    Join Date
    Jan 2013
    Location
    Florida
    Posts
    75
    Thanks
    2
    Thanked 0 Times in 0 Posts
    XELAWHO -

    i have been studying both of your working examples since you posted them, back in january. the second is so nice that i trashed 80% of my website and started over, incorporating it. thanks again.

    if i could ask 1 question. is there a way to in-line style the text strings ? i have tried adding span tags, and using +, etc. but it is a stubborn string. i would like to be able to add spaces and in-line styles (maybe change the color and font of certain words in the string).

  6. #21
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,688
    Thanks
    80
    Thanked 4,647 Times in 4,609 Posts
    Text strings are just that: Strings.

    So I assume you are talking about text in some browser object, e.g., inside a <div> or <span>? Note that you can *NOT* change the style of text that is in the value= of any form field.

    So, yea, you have to use the various HTML controls. Which means <b> and <i> and, almost surely, <span>.

    Code:
    <div>Now <span style="color: red;">is the time</span> for 
         all good men <span style="font-size: x-small;">to come</span> 
         <span style="font-size: xx-large; color: maroon; font-weight: bold;">TO!</span>
    </div>
    So I don't know what you mean by "it is a stubborn string", but the best thing to do would be to show it to us and tell us what you want it to look like.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  7. #22
    New Coder
    Join Date
    Jan 2013
    Location
    Florida
    Posts
    75
    Thanks
    2
    Thanked 0 Times in 0 Posts
    o pen -

    glad to. it is post #9. for example, caption says "woof". and i am having a tough time dealing with these strings.

  8. #23
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,688
    Thanks
    80
    Thanked 4,647 Times in 4,609 Posts
    Sorry, you've lost me. That caption is just one word. How is that relevant to your question about changing styles within a single string?

    But there's no reason it couldn't have been
    Code:
        caption: 'The dog says <span style="color: red; font-weight: bold;">woof!</span>',
    Just as an example.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  9. #24
    New Coder
    Join Date
    Jan 2013
    Location
    Florida
    Posts
    75
    Thanks
    2
    Thanked 0 Times in 0 Posts
    Old P -

    except that it doesn't work. it merely includes the span tags as more text.

    see this fiddle. http://jsfiddle.net/pratto/B6PjD/3/

  10. #25
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,688
    Thanks
    80
    Thanked 4,647 Times in 4,609 Posts
    It's your fault. For using yucky old jQuery.

    When you use $(...).text(sometext) jQuery create a textNode and appends it to what you selected. And text nodes indeed treat *ALL* characters as just text.

    So try using $("#capt").html(fotos[thepic].caption);

    That is, use the .html() method instead of the .text() method.

    If you are going to use jQuery, you need to learn what each of its functions actually do.

    If you had used vanilla JavaScript, I could have told you immediately what the problem was. Though more than likely you wouldn't have had a problem.

    In vanilla code, you'd just do:
    Code:
        var foto = fotos[thepic];
        document.getElementById("tit").innerHTML = foto.title;
        document.getElementById("it").innerHTML = foto.item;
        document.getElementById("capt").innerHTML = foto.caption;
    Okay, okay, I know you used jQuery to get the animated effect. But again, if you are going to use it, you need to learn what its functions actually do.
    Last edited by Old Pedant; 05-03-2013 at 08:10 AM.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  11. #26
    New Coder
    Join Date
    Jan 2013
    Location
    Florida
    Posts
    75
    Thanks
    2
    Thanked 0 Times in 0 Posts
    thank you sir. i got four for the price of one :

    a response, which is always welcome.
    the solution to the problem.
    an explanation of why it fixed it (something i always hope for).
    a lecture.

    i couldn't agree more about understanding the code i employ. otherwise it is just cut & paste & hope nothing goes wrong.

    i will say that i thought that text was text, as others did :

    Sorry, you've lost me. That caption is just one word. How is that relevant to your question about changing styles within a single string?

    But there's no reason it couldn't have been
    Code:
    caption: 'The dog says <span style="color: red; font-weight: bold;">woof!</span>',
    Just as an example.
    but you made me laugh. and i did learn something.

  12. #27
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    27,688
    Thanks
    80
    Thanked 4,647 Times in 4,609 Posts
    LOL! The lecture is as much aimed at the jQuery documentors as at you. The few times I've had to dip into jQuery docs to find something I, too, have been frustrated.

    I mean look at this page:
    http://api.jquery.com/text/

    First of all, you have to realize that you need to click on the second definition of the method, getting you to here:
    http://api.jquery.com/text/#text2

    And then, finally, you can find the paragraph that says:
    We need to be aware that this method escapes the string provided as necessary so that it will render correctly in HTML. To do so, it calls the DOM method .createTextNode(), does not interpret the string as HTML.
    So the docs indeed say it, but not right up front in clear English.

    To be fair to you, I've had over 40 years experience both reading and writing documentation, so I've learned *how* to look for the gotchas like this. Truly, reading and understanding documentation is as much an art form as anything.

    Anyway, it took me a while to find the problem, since I don't use jQuery, hence my comment about "yucky old jQuery." Definitely not really aimed at you.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.


 
Page 2 of 2 FirstFirst 12

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •