Maybe something like this?
function swap_letter() {
var firstP = $('#main-content p:first-child')[0];
var text = firstP.innerHTML;
if ( text ) {
firstP.innerHTML = text.slice(1).
$('<img />')
.src('/images/alphabet/' + text[0].toLowerCase() + '.gif')
.addClass('fancy-letter')
.prependTo( firstP );
}
}
I wish it was just as easy to deal with text as it was the DOM.
(Hmm... a new plugin?)
--John
> I'm trying to convert a little drop cap thing that I had done in DOM
> scripting to jQuery. Adding the drop cap image has been incredibly easy, but
> I'm stumped on how to remove the single letter of text that the image is
> replacing. I'm sure this is really simple, but I'm just not getting it, so
> any help would be much appreciated.
>
> Here is what I have so far:
>
> function swap_letter() {
> var first_letter = $('#main-content
> p:first-child').text().charAt(0);
> if (first_letter.length == 1) {
> $('<img />')
> .src('/images/alphabet/' + first_letter.toLowerCase() + '.gif')
> .addClass('fancy-letter')
> .prependTo($('#main-content p:first-child'));
> }
> }
>
> $(document).ready(function() {
> swap_letter();
> });
>
> You can see it almost working at
> http://test.learningjquery.com/dropcap.htm
>
> Any other suggestions for improvement are also most welcome. By the way,
> after I get this working, I plan to write it up as a tutorial on
> learningjquery.com, so I'll give credit (with a link to your site, if you
> wish) to anyone who helps.
_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/