JQuery append LI

29. 5. 2013 09:08:39

Dobrý den,

chtěl bych poprosit někoho kdo se orientuje v jQuery o malou radu. Na své stránky bych si rád přidal Twitter wall, který bych si rád graficky upravil.

Jako plugin jsem použil tento: http://plugins.theodin.co.uk/jquery/tweetable/tweetable.1.7/demo/index.html

V pluginu mám nastaveno zobrazování pouze dvou tweetů. Mezi tyto dva tweety

bych potřebol pomocí skriptu vložit ještě jeden

prvkem ve kterém se bude nacházet obrázek.

Použil jsem funkci append pomocí jQuery, ale ať se snažím jak se snažím nový prvek

to nedoplní.

Nevíte prosím kde může být problém?

Předem děkuji za reakce.

Zdrojová kód zde. Zkoušel jsem i varintu appendnout nový prvek na konec :last, ale opět bez výsledku:

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Tweetable 1.7.0 | Twitter jQuery plugin</title>
<meta name="author" content="Philip Beel theodin.co.uk" />
<meta name="description" content="" />
<meta name="keywords" content="" />
<meta name="viewport" content="width=device-width">

<script type="text/javascript">
	
	$(document).ready(function() {
		
		$('#tweets').tweetable({
		username: 'google',
		time: true,
		rotate: false,
		speed: 4000,
		limit: 2,
		replies: false,
		position: 'append',
		failed: "Sorry, twitter is currently unavailable for this user.",
		html5: true,
		onComplete:function($ul){
		$('time').timeago();
		}
		});

});
	</script>

<style>

#content{
	width: 960px;
	min-height: 10px;
	border:  solid 1px red;
}

#tweets{
	border: solid 1px #000;
	padding: 0;
	margin: 0;
	width: 100%;
}

.tweetList{
	padding: 0;
	margin: 0;
	width: 100%;
	overflow: hidden;
}

.tweetList ul{
	width: 100%;

}

.tweetList li{
	list-style: none;
	border: solid 1px #000;
	float:left;
	width: 33.333%;
}

.timestamp{
	text-align: right;
}

</style>

</head>
<body>

<div id="content">
	<div id="tweets">	
	</div>
</div>

</body>
	
	
	<script type="text/javascript">
	
	$(document).ready(function() {

$("ul.tweetList li:last").append("<li>Message Center</li>");

});
	</script>
</html>

29. 5. 2013 09:08:39

https://webtrh.cz/diskuse/jquery-append-li/#reply906498

Petr Pojer

(9 hodnocení)

29. 5. 2013 09:13:19

Zkus

29. 5. 2013 09:13:19

https://webtrh.cz/diskuse/jquery-append-li/#reply906497

KamilB

(9 hodnocení)

29. 5. 2013 09:28:48

Tohle je super. Už se to alespoň objeví tom UL. Poradil byste mi prosím ještě jak to dostat mezi ty dvě

, které se tam generují?

29. 5. 2013 09:28:48

https://webtrh.cz/diskuse/jquery-append-li/#reply906496

Registrace

(1 hodnocení)

29. 5. 2013 09:43:18

Napsal KamilB;954908
Tohle je super. Už se to alespoň objeví tom UL. Poradil byste mi prosím ještě jak to dostat mezi ty dvě
, které se tam generují?

Jedná se jen o jednoduchou úpravu tohoto řádku. V aktuální podobě říká, že se to má dát na konec seznamu.

Jistě na to přijdeš sám, jen tak se to naučíš.

29. 5. 2013 09:43:18

https://webtrh.cz/diskuse/jquery-append-li/#reply906495

KamilB

(9 hodnocení)

29. 5. 2013 09:49:09

Máte pravdu. Snad se mi to podaří vymyslet.

Tohle mi vloží

do prostřed. akorát ta potvora to místo před

vloží dovnitř

29. 5. 2013 09:49:09

https://webtrh.cz/diskuse/jquery-append-li/#reply906494

Registrace

(1 hodnocení)

29. 5. 2013 09:53:12

Napsal KamilB;954916
Máte pravdu. Snad se mi to podaří vymyslet.
$("li.tweet_content_1").prepend("<li>Message Center</li>");
Tohle mi vloží
do prostřed. akorát ta potvora to místo před
vloží dovnitř

No, protože už jsi objevil prepend, tak bych ti jen doporučil upravit původní kód a místo append použít prepend. Tedy:

Teda "vložit před poslední LI".

29. 5. 2013 09:53:12

https://webtrh.cz/diskuse/jquery-append-li/#reply906493

KamilB

(9 hodnocení)

29. 5. 2013 10:08:43

Ono tam právě dochází k této věci:

V tom mém i v tom vašem příkladu se to vloží dovnitř

. Podle toho zápisu by se to ale mělo vložit před poslední prvek LI

29. 5. 2013 10:08:43

https://webtrh.cz/diskuse/jquery-append-li/#reply906492