webForumDet fria alternativet

Hjälp med hash när jag klickar på en div

JavaScript

40 svar · 4 211 visningar · startad av bikic

Medlem sedan juni 2006261 inlägg
Frågan#1

Hej alla!

Jag har idag en portfolio där jag visar mina senaste arbeten. Dessa ligger i en grid och presenteras 4 per rad. När jag för över musen på dessa så sker lite coola effekter, och klickar jag på arbetet får jag en mer detaljerad vy på arbetet som fadas fram.

Vad jag vill är att när jag klickar fram en div för få en mer detaljerad vy så vill jag kunna få en hash tag på detta arbete - man ska även kunna länka till detta arbete genom att länka till ex. https://www.webforum.nu/#bikic

Då ska den ta fram den valda divven. Nu är det så att jag inte arbetar med länkar <a href=""></a> utan arbetar endast med ID-taggar som finns i divven med classtaggen "item".

Se exempel nedan på hur jag tar fram en gömd div. Använder mig inte av <a href="">.


$("#portfolio")
	.find(".item")
		.hover(portfolio.hoverIn, portfolio.hoverOut)
			.click(portfolio.open);
Medlem sedan juni 20019 519 inlägg
#2

#namn har inget med a-element med <a href="#hash"> att göra, den gå till elementet med samma ID #namn => id="namn"

så så länge du har ett ID på dina .item så borde det ju inte vara några problem att triggar click eventet vid en hash change.

Medlem sedan juni 2006261 inlägg
#3

Har försökt att leta efter just skapandet av hash tags, men jag hittar inget. Finns det någon bra sida?

Medlem sedan juni 20019 519 inlägg
#4

Vad menar du med det?

<div id="hash">....</div>

få en hash länk av #hash.

sätt hash i url:en:

window.location.hash = "hash";

Och få reda på vad du har för hash:

window.location.hash
Medlem sedan juni 2006261 inlägg
#5

Hej!

Jag har fått till det med hast tags nu i alla fall. Tack för det!

Vad jag nu vill kunna göra är att köra funktion portfolio.open om en giltig hash tag finns.

Kolla sidan om du har tid.

http://dev.ndesign.se

Medlem sedan juni 20019 519 inlägg
#6
$(window.location.hash).trigger("click")

?

Medlem sedan juni 2006261 inlägg
#7

Hej!

Fick till detta, men jag får det inte riktigt att fungera som jag vill ändå.


if (window.location.hash) {

	var myID = (window.location.hash).replace('#', '');
	$("item-" + myID).trigger("click");
				
}

Jag måste kunna trigga .click(portfolio.open);

Hur gör jag det?

Medlem sedan juni 20019 519 inlägg
#8

finns inget element som heter item-xxxx du är nog ute efter #item-xxxx i så fall.

hade skippat item- prefixet och bara kört på hashen direkt, utan att köra en replace, vilket kan skrivas om också:

if (window.location.hash) {
	$("#item-" + window.location.hash.replace("#","")).trigger("click");
}
Medlem sedan juni 2006261 inlägg
#9

Har du varit inne och kollat koden på sidan?

Om man klickar på <div id="item-janssonlunden" class="item"> så öppnar den divven <div id="janssonlunden" class="explore">.

Medlem sedan juni 20019 519 inlägg
#10

hade bytt namn på hellre, men koden ovan bör fungera bättre än din kod, du har inte letat efter ID:en utan element som heter <item-janssonlunden>

Medlem sedan juni 2006261 inlägg
#11

Hur hade du gjort? Du skriver "hade bytt namn på hellre" - vad menar du?

Medlem sedan juni 2006261 inlägg
#12

Din kod var mycket bättre ovan - men den får inte fram divven.

Medlem sedan juni 20019 519 inlägg
#13

bikic skrev:

Hur hade du gjort? Du skriver "hade bytt namn på hellre" - vad menar du?

istället för att ha kört item- på de hade jag struntat i det och kört det på dina "info-boxar" istället, för du binder inget "vettigt" mot dom ID:na ändå.

$("#item-janssonlunden").trigger("click")

fungera för mig så vad gör du för att det inte skall fungera?

Medlem sedan juni 20019 519 inlägg
#14

Du har:

setTimeout(setGrid, 300);

som orsakar crash, setTimeout skall ha en funktion och inte en kollektion för att den skall rocka.

Medlem sedan juni 2006261 inlägg
#15

Kolla nu! Fungerar inte med trigger('click');

Medlem sedan juni 20019 519 inlägg
#16

Nej, för du triggar click event innan du har satt något event på click, du måste binda det, enklaste exemplet jag kan ge dig med jquery custom-events är att du kan skapa egna sub-events på exempelvis click:

$(element).bind("click.fubar", function() {
alert('this is fubar!');
});

om du försöker triggar clickenent fubar innan du har buntit den så kommer den aldrig göra en popup, samma problem är det hos dig just nu, flytta koden så att du binder event innan du försöker triggar dom så kommer du få bättre resultat.

Medlem sedan juni 2006261 inlägg
#17

Nu blev det överkurs, men jag får bita i det sen. Tack!

Medlem sedan juni 20019 519 inlägg
#18

Överkurs vet jag inte ;).

Om du försöker triggar ett event som inte finns än så kommer den inte göra något annat än sitt default beteende, vilket din div inte har något, flytta din hash kod så att den körs EFTER du har bundit ditt event.

Medlem sedan juni 2006261 inlägg
#19

Hej igen!

Jag får verkligen inte till det.

Nu av någon anledning så hackar min animation när jag lägger in window.location.hash = itemID;

Hade uppskattat om du kunde visa mig hur jag får till det. Tröttsamt när man inte får sker och ting att fungera.

Medlem sedan juni 20019 519 inlägg
#20

Sätt hashen först efter animeringen är klar om det är där problemet är.

http://www.webforum.nu/showpost.php?p=1535483&postcount=8 fungerade för mig igår när jag körde på din sida, du få gärna beskriva vad du har problem.

262 ms totalt · 4 externa anrop · v20260731065814-full.86ec41c2
122 ms — deklarationer (db)
0 ms — hämta statistik (cache)
135 ms — hämta tråd, inlägg och bilagor (db)
124 ms — ändringar (db)