Home › Forums › JavaScript › How to disable the ´slash´ SVG image transformation effect in Script.JS Code…
- This topic is empty.
-
AuthorPosts
-
November 27, 2012 at 3:46 pm #41023orangeboyMember
Hi there…. Still having issues with this. I know it is possible to disable this effect by altering the code in this Script.js file, but I´m really not sure exactly what to alter. The effect uses the Raphael vector library, but that also controls the nice category slider effect- so I don´t want to completely remove it.
The pages concerned are http://www.dejavumarbellavintage.com/new-arrivals/ and http://www.dejavumarbellavintage.com/deja-vu-gallery/
I simply want to remove this slash transformation, but keep all the other effects that this library provides.
If someone could help me with this, I´d be very greatful!!! I can handle changing the CSS backgrounds, but I´m really not sure what to change in this Script.JS file below.
_Would really appreciate some help from you Javascript experts. Thankyou.
November 27, 2012 at 3:50 pm #115668orangeboyMember/* Swap featured image by vector objects os slashed shape */
$(document).ready(function() {// Swap featured images with vector objects
$(“.img-holder”).each(function () {
//$(this).removeClass(‘ro’);
var img = $(this).find(“img”);
var img_w = img.attr(“width”);
var img_h = img.attr(“height”);
var img_h_m = img_h – 30;
var img_src = img.attr(“src”);
img.css(‘display’ , ‘none’);var paper = Raphael(this, img_w, img_h);
// iOS devices can not apply path background image correctly. We are using clipping instead.
if ($.browser.safari){
var p = “M0,30L”+img_w+”,0L”+img_w+”,”+img_h_m+”L0,”+img_h+”L0,30″;
var p_img = paper.image(img_src, 0, 0, img_w, img_h);
p_img.attr({
stroke: “none”,
“clip-rect”: p
});
}
else{
var c = paper.path(“M 0 30 L “+img_w+” 0 L “+img_w+” “+img_h_m+” L 0 “+img_h+” L 0 30″);
c.attr({
stroke: “none”,
fill: “url(“+img_src+”)”
});
}
});// Swap HomePage thumbnails with vector objects
$(“.slide-h”).each(function () {
var img_w = $(this).find(“img”).attr(“width”);
var img_h = $(this).find(“img”).attr(“height”);
var img_h_m = img_h – 15;
var img_src = $(this).find(“img”).attr(“src”);var paper = Raphael(this, img_w, img_h);
if ($.browser.safari){
var p = “M0,15L”+img_w+”,0L”+img_w+”,”+img_h_m+”L0,”+img_h+”L0,15″;
var img = paper.image(img_src, 0, 0, img_w, img_h);
img.attr({
stroke: “none”,
“clip-rect”: p
});
}
else{
var c = paper.path(“M 0 15 L “+img_w+” 0 L “+img_w+” “+img_h_m+” L 0 “+img_h+” L 0 15″);
c.attr({
stroke: “none”,
fill: “url(“+img_src+”)”
});
}
});});
/************************************************************************************************************************************************/
/* Hover holder for svg-objects */
$(function() {
$(‘#multicol:not(.portfolio_massonry) .img-holder, #multicol-gal .img-holder’).append(‘‘).each(function () {
var $span = $(‘> div.i-am-overlay:not(.highslide-maincontent)’, this);
if ($.browser.msie && $.browser.version < 9)
$span.hide();
else
$span.css(‘opacity’, 0);
$(this).hover(function () {
if ($.browser.msie && $.browser.version < 9)
$span.show();
else
$span.stop().fadeTo(500, 1);
}, function () {
if ($.browser.msie && $.browser.version < 9)
$span.hide();
else
$span.stop().fadeTo(300, 0);
});
});
});/****************************************************************************************************************/
/* Hoovers for svg-objects */
$(function() {
// Add rollovers to gallery-posts thumbnails
var slideshow_group_counter = 100;
$(“#multicol:not(.portfolio_massonry) .img-holder:not(.n-s) div.i-am-overlay”).append(‘‘).each(function () {
$(‘a.detal’, this).attr(‘href’, $(this).parent(‘div’).find(‘a’).attr(‘href’));elems = $(this).parents(“.article”).find(“.gal_in_posts a”);
var group = ‘group’+slideshow_group_counter;
var tid = ‘for_’+group;
elems.eq(0).attr(“id”, tid);
slideshow_group_counter++;var slideshow_options_bak = {};
$.extend(slideshow_options_bak, gallery_slideshow);
gallery_slideshow.slideshowGroup = group;
hs.addSlideshow(slideshow_options_bak);$(‘a.zoom-gal’, this).attr(‘href’, ‘javascript:;’).attr(‘onclick’, ‘document.getElementById(”+tid+”).onclick()’);
elems.each(function () {
$(this).addClass(“hs_attached”);
if (!$(this).attr(“href”))
return;
this.onclick = function () {
gallery_group.slideshowGroup = group;
gallery_group.thumbnailId = tid;
return hs.expand(this, gallery_group);
};
});var item_info = $(this).parents(“.article”).find(“.photo-info”);
item_info.css(‘display’,’none’);var info_box = $(this).find(“a.detal”);
info_box.hover(function() {
item_info.stop().fadeTo(400,1);
}, function() {
item_info.stop().fadeTo(200,0, function() { item_info.hide() });
});var img_w = $(this).parent(“div”).width();
var img_h = $(this).parent(“div”).height() + 2;
var img_h_m = img_h – 30;var paper = Raphael(this, img_w, img_h);
if ($.browser.safari){
var p = “M0,30L”+img_w+”,0L”+img_w+”,”+img_h_m+”L0,”+img_h+”L0,30″;
var p_img = paper.image(gal_h, 0, 0, img_w, img_h);
p_img.attr({
stroke: “none”,
“clip-rect”: p
});
}
else{
var c = paper.path(“M 0 30 L “+img_w+” 0 L “+img_w+” “+img_h_m+” L 0 “+img_h+” L 0 30″);
c.attr({
stroke: “none”,
fill: “url(“+gal_h+”)”
});
}
});// Add rollovers to regular-posts thumbnails
$(“#multicol:not(.portfolio_massonry) .img-holder.n-s div.i-am-overlay”).append(‘‘).each(function () {
$(‘a.detal’, this).attr(‘href’, $(this).parent(‘div’).find(‘a’).attr(‘href’));
$(‘a.zoom’, this).attr(‘href’, $(this).parent(‘div’).find(‘a’).attr(‘data-img’));var img_w = $(this).parent(“div”).width()+18;
if ($.browser.msie)
var img_h = $(this).parent(“div”).height();
else
var img_h = $(this).parent(“div”).height()+2;
var img_h_m = img_h – 30;
var paper = Raphael(this, img_w, img_h);if ($.browser.safari){
var p = “M0,30L”+img_w+”,0L”+img_w+”,”+img_h_m+”L0,”+img_h+”L0,30″;
var p_img = paper.image(gal_h, 0, 0, img_w, img_h);
p_img.attr({
stroke: “none”,
“clip-rect”: p
});
}
else{
var c = paper.path(“M 0 30 L “+img_w+” 0 L “+img_w+” “+img_h_m+” L 0 “+img_h+” L 0 30″);
c.attr({
stroke: “none”,
fill: “url(“+gal_h+”)”
});
}
});$(“#multicol-gal.two_level_gal .img-holder div.i-am-overlay”).append(‘‘).each(function () {
var item_info = $(this).parents(“.article”).find(“.photo-info”);
item_info.css(‘display’,’none’);var info_box = $(this).find(“a.detal”);
info_box.hover(function() {
item_info.stop().fadeTo(400,1);
}, function() {
item_info.stop().fadeTo(200,0, function() { item_info.hide() });
});var img_w = $(this).parent(“div”).width();
var img_h = $(this).parent(“div”).height() + 2;
var img_h_m = img_h – 30;var paper = Raphael(this, img_w, img_h);
if ($.browser.safari){
var p = “M0,30L”+img_w+”,0L”+img_w+”,”+img_h_m+”L0,”+img_h+”L0,30″;
var p_img = paper.image(gal_h, 0, 0, img_w, img_h);
p_img.attr({
stroke: “none”,
“clip-rect”: p
});
}
else{
var c = paper.path(“M 0 30 L “+img_w+” 0 L “+img_w+” “+img_h_m+” L 0 “+img_h+” L 0 30″);
c.attr({
stroke: “none”,
fill: “url(“+gal_h+”)”
});
}
});November 27, 2012 at 3:59 pm #115671orangeboyMember$(“#multicol-gal.one_level_gal .img-holder div.i-am-overlay”).append(‘‘).each(function () {
var img_w = $(this).parent(“div”).width();
var img_h = $(this).parent(“div”).height() + 2;
var img_h_m = img_h – 30;var paper = Raphael(this, img_w, img_h);
if ($.browser.safari){
var p = “M0,30L”+img_w+”,0L”+img_w+”,”+img_h_m+”L0,”+img_h+”L0,30″;
var p_img = paper.image(gal_h, 0, 0, img_w, img_h);
p_img.attr({
stroke: “none”,
“clip-rect”: p
});
}
else{
var c = paper.path(“M 0 30 L “+img_w+” 0 L “+img_w+” “+img_h_m+” L 0 “+img_h+” L 0 30″);
c.attr({
stroke: “none”,
fill: “url(“+gal_h+”)”
});
}
});});
/*****************************************************************************************************************************************************/
//hover effect
$(function() {
$(‘.fadeThis, a.alignleft:not(.not), a.alignright, a.aligncenter, a.alignnone, .button-h, .gall_std li a’).append(‘‘).each(function () {
var $span = $(‘> span.hover’, this);
if ($.browser.msie && $.browser.version < 9)
$span.hide();
else
$span.css(‘opacity’, 0);
$(this).hover(function () {
if ($.browser.msie && $.browser.version < 9)
$span.show();
else
$span.stop().fadeTo(500, 1);
}, function () {
if ($.browser.msie && $.browser.version < 9)
$span.hide();
else
$span.stop().fadeTo(500, 0);
});
});
$(‘.gall_std li a’).each(function(){
var im = $(this).find(‘img’);
var im_h = im.height();
var im_w = im.width();
$(‘span.hover’, this).css({
height:im_h,
width:im_w
})
})
});/******************************************************************************************************************************/
/* Service tooltips: tags, categories, social links, etc. */
$(function() {
$(‘.ico-l’).each(function () {
var $tip = $(‘> .info-block’, this);
var $span = $(‘> span’, this);
if (!$span.length) {
var $span = $(‘> a’, this);
};var $old_html = $tip.html();
var $new_html = ‘‘ + $tip.html() + ‘‘;
$(this).hover(function () {
$span.addClass(‘act’);
$offset = $span.offset();
$tip.html($new_html);if ($.browser.msie && $.browser.version < 9) {
$tip.show();
} else {
$tip.css(‘display’, ‘none’);
$tip.stop().fadeTo(300, 1);}
}, function () {
$span.removeClass(‘act’);
if ($.browser.msie && $.browser.version < 9) {
$tip.hide();
$tip.html($old_html);
} else {
$tip.css(‘display’, ‘block’);
$tip.stop().fadeTo(50, 0, function() {$tip.css(‘display’, ‘none’); $tip.html($old_html);});
}
});
});
});/****************************************************************************************************************/
/* New gallery */
$(function () {// normal hs
$(“.fadeThis”).each(function () {
if ( $(this).attr(“href”) == ‘#’ )
$(this).attr(“href”, $(this).find(“img”).attr(“src”) );
this.onclick = function () {
hs.expand(this, hs_config2);
return false;
};
});// gallery 1 level
$(“.one_level_gal”).each(function () {
els = $(“.img-holder”, this);
els.each(function () {
var config = {};
$.extend(config, hs_config1);
var im = $(this).children(“img”);
var s = im.attr(“src”);
//config.src = s;
config.slideshowGroup = slideshow_options.slideshowGroup;
var mini = $(this).children(“a”);
if ( mini.length )
{
//config.src = mini.attr(“href”);
}
else
{
mini = $(““);
mini.attr(“href”, s);
mini.appendTo( $(this) );
}mini.append( im.clone() );
mini[0].onclick = function () {
return hs.expand(this, config);
};$(this).click(function () {
mini.trigger(“onclick”);
return false;
});
});
});});
/*************************************************************************************************************************************************/
$(document).ready(function(){
Cufon.CSS.ready(function() {
var right_s = $(‘.static #pg_desc2 div, .video #pg_desc2 div’).width() – $(‘.static #pg_desc1 div, .video #pg_desc1 div’).width() + 20;
var b = 70 + $(‘.static #pg_desc2 div, .video #pg_desc2 div’).height();$(‘.static #pg_desc1 div’).css( {‘right’ : right_s , ‘bottom’ : b} );
$(‘.static #pg_desc2 div’).css( {‘right’ : 20, ‘bottom’ : 60 } );$(‘.video #pg_desc1 div’).css( {‘right’ : right_s , ‘bottom’ : b} );
$(‘.video #pg_desc2 div’).css( {‘right’ : 20 , ‘bottom’ : 60} );
});
});/****************************************************************************************************************/
//jQuery.noConflict();
jQuery(document).ready(function($){/* Quick Isotope for Gallery */
function do_isotope(iContainer, iItem, iWidth) {
var $iContainer = $(iContainer);
if (!iContainer.length)
return;
var resizeTimeout = false;
$(window).resize(function(){clearTimeout(resizeTimeout);
resizeTimeout = setTimeout(function() {
Cufon.CSS.ready(function() {
if ($(window).width() < 1024) {
$iContainer.isotope({
containerClass : ‘isotoped’,
itemSelector : iItem,
transformsEnabled: false,
animationEngine: ‘css’,
masonry : {
columnWidth : iWidth
}
});
}
else{
$iContainer.isotope({
containerClass : ‘isotoped’,
itemSelector : iItem,
transformsEnabled: false,
animationEngine: ‘jquery’,
masonry : {
columnWidth : iWidth
},
animationOptions: {
duration: 750,
easing: ‘linear’,
queue: false
}
});
}
});
},200)
}).trigger(‘resize’)
}
/*
*//* Slasher for Gallery */
function do_slash(iItem) {
// Swap featured images with vector objects
$(iItem).each(function () {
var img = $(this).find(“img”);
var img_w = img.attr(“width”);
var img_h = img.attr(“height”);
var img_h_m = img_h – 30;
var img_src = img.attr(“src”);$(this).css(‘height’,img_h);
$(this).css(‘widtht’,img_w);
img.css(‘display’ , ‘none’);var paper = Raphael(this, img_w, img_h);
// iOS devices can not apply path background image correctly. We are using clipping instead.
if ($.browser.safari){
var p = “M0,30L”+img_w+”,0L”+img_w+”,”+img_h_m+”L0,”+img_h+”L0,30″;
var p_img = paper.image(img_src, 0, 0, img_w, img_h);
p_img.attr({
stroke: “none”,
“clip-rect”: p
});
}
else{
var c = paper.path(“M 0 30 L “+img_w+” 0 L “+img_w+” “+img_h_m+” L 0 “+img_h+” L 0 30″);
c.attr({
stroke: “none”,
fill: “url(“+img_src+”)”
});
}
});
} -
AuthorPosts
- The forum ‘JavaScript’ is closed to new topics and replies.