2011-08-25 4 views
0

아주 간단한 이미지를 쓰려고하는데, 트위터 위젯 로고를 지정한 로고로 대체하려고합니다. 어떻게해야합니까, 트위터 로고에는 ID 나 클래스가 없으므로 대체 방법을 정확히 알지 못합니다. 각 이미지를 반복해야하고 그 다음 이미지 만 교체해야합니다. 성냥.JQuery/Javascript Image Replace

예 ..

<script src="http://widgets.twimg.com/j/2/widget.js"></script> 
<script> 
new TWTR.Widget({ 
    version: 2, 
    type: 'profile', 
    rpp: 4, 
    interval: 6000, 
    width: 250, 
    height: 300, 
    theme: { 
    shell: { 
     background: '#333333', 
     color: '#ffffff' 
    }, 
    tweets: { 
     background: '#000000', 
     color: '#ffffff', 
     links: '#4aed05' 
    } 
    }, 
    features: { 
    scrollbar: false, 
    loop: false, 
    live: false, 
    hashtags: true, 
    timestamp: true, 
    avatars: false, 
    behavior: 'all' 
    } 
}).render().setUser('twitter').start(); 
</script> 

위 IT는 트위터 로고를 렌더링하고 URL을 http://widgets.twimg.com/i/widget-logo.png, 나는 /image/twitter.jpg로 변경해야 할 것입니다, 내가 사용하고있는 트위터 코드입니다. (이 요소의 특정 정보 때문에)

+0

이 위젯이 실제로 사용되는 링크를 제공해 주시겠습니까? 그렇지 않으면 난 방화범이 끌려 가거나 (또는 ​​devtool) 이미지를 보면 스타일이 있는지 확인하려고합니다. 왜냐하면 이것은 jquery-selector를 사용할 수 있기 때문입니다. 그런 다음 ('img'). attr ('src', '/ image/twitter.jpg')을 설정하여 src 속성을 변경하면됩니다. 스타일이 없다면, 이미지를 처리하는 방법을 찾기 위해 마크 업을 파헤 치고 .eq() 또는 jquery 함수를 사용하십시오. 그러나 위젯이 어딘가에서 작동하는 것을 볼 수 있다면 자세한 답변을 드릴 수 있습니다. – GNi33

+0

왜이 작업을 수행 하시겠습니까? 당신이 허락을 받았음을 확인 했습니까? –

+0

http://twitter.com/about/resources/widgets/widget_profile 위젯이 사용되는 곳입니다. – techco1

답변

0

당신은 엄격하게 동일한 경우, 속성 테스트를 사용할 수 있습니다

var logoTwitter = $('img[src="http://widgets.twimg.com/i/widget-logo.png"]'); 

사진 URL이 너무 일치하지 않는 경우 (아마도 일부 변수를 의미) jQuery를 사용 http://api.jquery.com/category/selectors/

4

:

var logoTwitter = $('img[src$="/widget-logo.png"]'); 

확인이 선택기 : 당신과 함께 끝을 테스트 할 수 있습니다 토륨 설정 소스 속성이 이미지를 찾을 수 e 트위터 로고를 추가하고 src 속성을 이미지의 상대 URL로 바꿉니다.

$("img[src='http://widgets.twimg.com/i/widget-logo.png']").attr("src","/image/twitter.jpg"); 
+0

와우, 방금 뭔가 배웠습니다. 고맙습니다! 선택기에서 src 속성을 직접 사용할 수 있는지 여부를 몰랐습니다. – GNi33

+0

하지만 천천히 진행될 수 있습니다. 트위터 버튼을 놓는 컨테이너를 선택하고 ID를 부여한 다음 그 컨테이너 내부의 유일한 img를 찾으십시오. –

+0

오류가 발생했습니다! 알 수없는 구문 오류, 알 수없는 표현 : src = 'http : //widgets.twimg.com/i/widget-logo.png') – techco1

0

선택기를 사용하여 로고가있는 속성을 찾습니다. 이 작업은 selector $('div.twtr-ft a[href="http://twitter.com"] img')을 사용하여 태그를 찾은 다음 attr 함수를 사용하여 src 특성을 바꿉니다.

위의 문제점은 위젯 변경으로 인해 코드가 손상 될 수 있다는 것입니다. 선택기의 홈페이지는 이미지 위치보다 변경 가능성이 적기 때문에 홈페이지를 사용하기로했습니다. div.twtr-ft는 선택 사항이지만 이미지가있는 앵커가 포함 된 위젯에 코드를 추가하지 못하게합니다.