I was wondering if I didn't sound like an idiot saying "$this" isn't
"this" anymore when it's html got changed, even though it was exactly
same html as before.
I confirmed it with a little test. Even though in below example the
html output is identical to start, $this no longer works. Confirms what
I thought regarding what is happening to the links in your page
<script type="text/_javascript_">
$(document).ready(function() {
$("span ").click(function() {
$this= $(this);
$("p").html(" test for<span> this</span>");
$($this).css("color","red");
});
});
</script>
</head>
<body>
<p>test for<span> this</span></p>
<p>test for<span> this</span></p>
<p>test for<span> this</span></p>
<p>test for<span> this</span></p>
<p>test for<span> this</span></p>
</body>
</html>
Charlie Tomlinson
GET NOTICED Internet Solutions
(614) 202-5150
Charlie wrote:
while i was writing
toggleClass portion below I slipped up....
$(".main_image").toggleClass... should be
$(".gallery_image").toggleClass
Charlie wrote:
found the basis of
problem but can't make it work in firebug.
$(".main_image").live('click',function(){
(...................)
var $target = $(this);
$rows.each(function(){
(..............)
$(this).find('.gallery_image').html('<a
class="main_image" href=""><img alt="" title="Main" style="border: 0pt none;"
src="" /></a>');
});
$target.parent().html=("<img
src='' alt='' />");
return false;
});
/*********************
I think when you completely replace all the ".main_image" html in
$rows.each you are no longer able to refer to current one as "this". I
can't confirm in firebug because of existing function. I tried doing
simple things to "this" from within another click function in firebug
and wouldn't work.
Also $target.parent() , take out parent()
Seems would be a lot more efficient to build all the links in to
gallery load, only swap box colors on click? That way only writing all
the links once instead of rewriting each link every time one is used?
If that's not an option- rewrite $(this).find('.gallery_image') so it
excludes current one.
One way to do that would be :
$(".main_image").live('click',function(){
$(".main_image").toggleClass("greenboxClass");// won't need
this if you overwrite with html()
$(this).parent(".gallery_mage").addClass("greenboxClass");
$rows.each.............
$(this).find('.gallery_image').not(".greenboxClass").html(....................................)
//now switch images
hope this helps, took a while to figure out and tricky when can't test
along the way
theprodigy wrote:
ok, here's the deal,
Go to http://www.hypertextwebdesign.com/admin
Click the submit button for placeholder login form
Click Galleries in the menu on the left
Click 4th Gallery in the list that appears (should be first item)
You are now in Photo Listing page (lists photos for gallery "4th
Gallery")
On the right side of the photo list, you see a column called "Gallery
Image"
This is displaying a green box for one of the photos, and a red box
for the other
The green box is just an image, the red box is an image inside a link
What I want to happen:
When red box is clicked, I want it to turn to green image, and all
others to be red image with link.
The link includes an id number for that photo (id number can be found
in table row id( tr id="photo_2", 2 is photo id, and link is "http://
www.hypertextwebdesign.com/admin/galleries/p_makemain/
2.php")
The code that I currently have is able to turn all the rows to red
blocks with correct links, but for some reason will not turn the
currently selected row to a green box.
You can view the source of the page to get the HTML markup (since
posting it here seems to be too much garbage), and you can view my
current js markup at http://www.hypertextwebdesign.com/admin/js/main.js
(The code for this part is about halfway down the page and starts with
$(".main_image").live('click',function(){
Please help. My code may not be very efficient, and I apologize if it
isn't.
Thanks
|
