Response title
This is preview!
- Screen name: thehunter
thehunter's Profile
15 Posts
19 Responses
0
Followers
Activity Trend
Last 30 days
Loading Chart...
Show:
- Expanded view
- List view
- I have a lot of images on a page and the have to be a little bit larger, so i dont want to change all of the css.
I have made a couple of lines of code which doesn't give the right values back.
The images have all diffrent sizes.- $('.imgbox').each(function(){
var getX = $(this).width();
var getY = $(this).height();
var addX = 10;
var xH = getY + addX;
var xW = getX + addX;
$(this).children('img').css({width: xW + 'px', height: xH+ 'px'});
}); - <div class="imgbox">
<img src="image_blabla.jpg" /> - </div>
there's probably some thing wrong because it gives me very big values back.- 20-Apr-2011 06:51 AM
- Forum: Getting Started
I am looking for a simple parallax/animate like effect, i have a single image and if i hover on it the image should move like the parallax effect.
So if i put my mouse in the topleft corner the image should move in the direction bottomright.
I know this i very simple but i cant seem to get it working or how to get this working.
any help?- 29-Nov-2010 05:15 PM
- Forum: Using jQuery Plugins
I am working with the plugin called quicksand, all things work but when ik use the quicksand the ligthbox works but only the images wont load(in the beginning the images will load)
Tha basic plugin code below, as you can see theres and enhancement part which reloads all other jquery stuff used on the section.- $('.sort-by-cat').quicksand($filteredData, {
duration: 500,
easing: 'easeInOutQuad',
useScaling: true,
adjustHeight: false,
enhancement: function() {
lightbox();
}
basic html structure- <li>
<img src="images/media/dummy1.jpg" alt="" />
<span class="ctrls">
<a href="images/media/dummy-big1.jpg" title="" class="pirobox_media1 view">view</a>
<a href="#" title="" class="edit">edit</a>
<a href="javascript:void(null);" title="" class="delete-media">Delete</a> </span>
</li>
- 28-Nov-2010 04:47 PM
- Forum: Using jQuery UI
I am using the jQuery UI sortables, but i want them so memorize there dragged postions, so the order of the boxes(stored in a cookie). I am nog jQuery expert so how can this be done in a fast and easy way?
So store and display.
Below the UI code- $(".sort").sortable({
handle: '.box-header',
placeholder: 'sortHelper',
delay: 250,
cursor: 'move',
revert: true,
opacity: 1.0,
axis: 'y',
forcePlaceholderSize: true
});
The html code- <ul class="sort">
<li>
<!-- content -->
</li>
<li>
<!-- content -->
</li>
<li>
<!-- content -->
</li>
</ul>
- 29-Jul-2010 09:57 AM
- Forum: Using jQuery
I have writen(as you can see i am not a jQuery expert :P ) a small piece of code for a ul/li collapsible menu, all browsers do what i want but IE8 is not working propper.- jQuery("a.cat_w_sub").toggle(function(){
if (jQuery(this).next("ul").is(":hidden")) {
jQuery(this).next("ul").slideDown(100);
jQuery(this).addClass("cat_open");
}else{
jQuery(this).next("ul").slideUp(100);
jQuery(this).removeClass("cat_open");
}
}, function(){
if (jQuery(this).next("ul").is(":hidden")) {
jQuery(this).next("ul").slideDown(100);
jQuery(this).addClass("cat_open");
}else{
jQuery(this).next("ul").slideUp(100);
jQuery(this).removeClass("cat_open");
}
});
I have used the jQuery ui accordion first but this wasn't work that well, so i switch to this piece of code
The bug/error: well if i click on the menu(which is closet at first) it doesn't open at first but once i click on it, it opens and closes.
Any idea's?
Sorry but i dont have an demo online.- 13-Jan-2010 09:02 PM
- Forum: Using jQuery
I have a small admin panel where i can delete items, if used an jquery animation and hide function when i click on the delete button, but when i click on the button the jquery works perfect but for some resaon the php delete function doesnt work(if tryed a basic link, like index.html, but this doesnt works)
When i click the btn the page doesn't refresh, anybody have a solution for this?
This is the jquery code
- // remove a row
$(".delete-row").click(function() {
$(this).parents('.pages-row, .user-row, .media-row')
.effect("highlight", {}, 100).animate({
opacity: 0
},function () {
$(this).hide();
});
$(this).parents(".pages-row, .user-row").next("div").hide();
return false;
});
- I am building a new website which has some boxes that changes from classes(done with jquery magic
).
I want to add an overlay(like the lightbox fading background) to the page when the user clicks on the switch button.
I have tried a couple of things but it seems not to work:
If tried to append a div to the body but that doesn't seems to work:
anybody a idea?$(".nl").click(function(){
$("div.lang_english").fadeOut("fast", function() {
$(this).fadeIn("fast").removeClass("lang_english").addClass("lang_dutch");
});
});
- I am looking for a timeout/countdown(dotn know the right name of it),
i have a site where i have a couple images that are divided in different categories(web, print, logo) if i click on the web button al of the non web images fade(opacity), i dont want to use and reset btn thats why i am looking for a timer. when the time is up all of the images fade back.
Example code(very basic)
$('#hi-ind').click(function(){
$('.hi-logo').fadeTo("slow", 0.10);
$('.hi-web').fadeTo("slow", 0.10);
$('.hi-grap').fadeTo("slow", 0.10);
$('.hi-ind').fadeTo("slow", 1.0);
});
thanks- 25-Jul-2009 07:16 AM
- Forum: Using jQuery
I want to use the jquery cookie to remember if one of the boxes was down or up. I can only store 2 values i a cookie. Any one a simple trick for this?
This the part that i now have:
/* toggle selected box */
$(".content-header-right").click(function(){
$(this).parents(".content-header").next(".content-in").slideToggle("slow");
// get the id of the box
var id = $(this).parents(".content-header").next(".content-in").attr('id');
if ($(this).find('a.toggle-close-btn').is(":hidden")){
$(this).find('a.toggle-close-btn').show();
$(this).find('a.toggle-open-btn').hide();
$.cookie(id, 'show');
} else {
$(this).find('a.toggle-open-btn').show();
$(this).find('a.toggle-close-btn').hide();
$.cookie(id, 'hide');
}
});
- I want to use the jQuery cookie to remember is the toggle panel was down or up.
Tis is the code but i dont works, i have used a styleswitcher and this uses also a cookie and this one works.
// toggle hiddenmenu
$("a#toggle-open-btn, a#toggle-close-btn").click(function () {
if ($("#toggle-box-1").is(":hidden")) {
$("#toggle-box-1").slideDown("slow");
$("#topmenu").slideToggle("slow");
$.cookie('showTop', 'collapsed');
return false;
} else {
$("#toggle-box-1").slideUp("slow");
$("#topmenu").slideToggle("slow");
$.cookie('showTop', 'expanded');
return false;
}
var showTop = $.cookie('showTop');
if (showTop == 'collapsed') {
$("#toggle-box-1").show();
$("#topmenu").hide();
};
if ($('#toggle-close-btn').is(":hidden")){
$('#toggle-close-btn').show();
$('#toggle-open-btn').hide();
} else {
$('#toggle-open-btn').show();
$('#toggle-close-btn').hide();
}
});
- I am using a table for some data and when i click on the edit button i want to toggle a row but for some reason the colspan tags doesn’t work(it works when i not use the toggle)
<table>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5 (click)</td>
</tr>
<tr class="toggle">
<td colspan="5">lorem ipsum..........</td>
</tr>
</table>
when i click on the toggle button the colspan=â€- I want to use a toggle to hide and show some content but it isnt working
html code:<div class="comments-box">
<div class="profile-comment-bg">
<img src="images/profile.jpg" alt=""/>
</div>
<div class="comments-right">
<p class="com-name">title</p>
<p>content</p>
<p class="c"><a class="edit-comments" href="#">Edit</a></p>
<p class="comments-date">2009/06/16 at 12:15pm</p>
</div>
<div class="comments-toggle">toggle this box</div>
</div>
JS code:$(".edit-comments").click(function () {
$(this).next(".comments-toggle").slideToggle("fast");
});
but this code dont works correct, notiv that i want to use more then one box.
cheers- I am looking for a way to switch between 2 images in a accordion.
JS:$(".toggle").click(function(){
var id = $(this).attr('id');
$("#toggl"+ id).slideToggle("slow");
if ($('.close').is(":hidden")){
$(".close").show();
$(".open").hide();
} else {
$(".open").show();
$(".close").hide();
}
});
HTML:<div class="box-780-head">
<h3>Box 1</h3>
<a href="#" class="toggle" id="e1">
<img src="toggle-plus.jpg" class="close" alt=""/>
<img src="toggle-min.jpg" class="open" style="display:none;" alt=""/>
</a>
<img src="delete.jpg" class="delete" alt=""/>
</div>
<div class="box-780-body" id="toggle1">toggle content</div>
As you can see this will switch all of the button on a page.
Hope some one knows to help me with this?
I dont want to give the images an #id!
greetz- I want to remove a specific box when i click on the remove button in that box.
I have a lot of boxes on a page but when i click on the remove btn it removes all the boxes. I just want to remove the box where i click on the delete btn.
This is the js code:$(".del").click(function() {
$('div.floating-box').remove();
});
Html code:<div class="floating-box">
<div class="box-780-head">
<h3>Box 1</h3>
<a href="#" class="toggle"><img src="images/icons/toggle-plus.jpg" alt=""/></a>
<a href="#"><img src="images/icons/delete.jpg" class="del" alt=""/></a>
</div>
<div class="box-780-body">lorem......</div>
</div>
<div class="floating-box">
<div class="box-780-head">
<h3>Box 2</h3>
<a href="#" class="toggle"><img src="images/icons/toggle-plus.jpg" alt=""/></a>
<a href="#"><img src="images/icons/delete.jpg" class="del" alt=""/></a>
</div>
<div class="box-780-body">lorem......</div>
</div>
<div class="floating-box">
<div class="box-780-head">
<h3>Box 3</h3>
<a href="#" class="toggle"><img src="images/icons/toggle-plus.jpg" alt=""/></a>
<a href="#"><img src="images/icons/delete.jpg" class="del" alt=""/></a>
</div>
<div class="box-780-body">lorem......</div>
</div>
...............................
...............................
...............................
greetz- My knowledge about jQuery is limited so i need some help, i want to use a slide up box in a image(this box contains a couple of thumbnails for every image). My problem is everytime i add a new images is have to ad a new class.
jQuery.fn.overl = function(classe) {
$(this).hover(function(){
$(this).find(classe).stop().animate({height:'70px',opacity: '0.9'},400);
},function () {
$(this).find(classe).stop().animate({height:'0',opacity: '0'}, 400);
});
}
$('.cycle-wrap').overl('.overlay-1, .overlay-2, .overlay-3');
as you can see is use 3 classes but i just want to use one. But if i use one class the thumbnails are not working correct.
I want to use the code below$('.cycle-wrap').overl('.overlay-1');
I think the code must be placed in some kind of for each loop.
I hope somebody understands me, sorry for the bad Language english is not my main Language.
greetz
© 2013 jQuery Foundation
Sponsored by
and others.
- $('.imgbox').each(function(){